youtube點擊計數
紀錄一下如何使用youtube api來計算嵌入影片被點擊的次數，這個API也可以用來控制嵌入影片的撥放、暫停等等，這裡就是利用影片的播放狀態來進行撥放的判斷。
youtube api網址
https://developers.google.com/youtube/iframe_api_reference?hl=zh-TW
下面為簡易範例，範例中$k為序號、vid為youtube的影片網址的v值、cid內則是自己判斷用的id。
首先是html的部分，這裡使用PHP的迴圈產生html。
<?php foreach($video_list as $k => $v){ ?>
<div id="tychange_<?=$k?>" vid="<?=$v['v']?>" cid="<?=$v['id']?>" ></div>
<?php } ?>
接著利用api判斷撥放狀態，在狀態有變化時利用jquery來進行狀態回傳。
//基本載入函數
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
//在youtube讀取完畢後執行
function onYouTubeIframeAPIReady() {
$('.tychange').each(function(ind){
_vid = $(this).attr('vid');
new YT.Player('tychange_'+ind, {
videoId: _vid
,events: {
'onStateChange': onPlayerStateChange
}
});
});
}
//狀態變化時會被呼叫的函數
function onPlayerStateChange(event){
if(event.data==1){//判斷狀態進行回傳
cid = $('#'+event.target.h.id).attr('cid');
$.ajax({
type: "POST",
url: "回傳用的網址",
data: {
cid : cid
},
dataType: "html",
success: function(data){
}
});
}
}
接著在後端靠著傳來的id進行額外的處理即可。