実行結果
設置サンプル：[YouTube API(v3) - 再生リスト内の動画情報取得（認証なし）
設置サンプルのソース
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="/module/include/strm/youtubedataapi_v3_list/style.css">
<title>YouTubeAPIv3サンプル | 再生リスト内の動画情報取得（認証なし）</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
/* 再生リストID
食べたもの♪ http://www.youtube.com/playlist?list=PLmjuevQrM8DA1EpfZ9Cu5hAFE7WKZtOhn
*/
//var PLAYLIST_ID="PLmjuevQrM8DA1EpfZ9Cu5hAFE7WKZtOhn";
//var PLAYLIST_ID="PLIBTIgwo1klTi59PIDQT9ggXi-U4b5kAk";
var PLAYLIST_ID="PLSHcBF713noUkDvX09CQ_-l9VkNhNXV0q";//F5
/* 開発キー
https://developers.google.com/youtube/registering_an_application
*/
var APIKEY="AIzaSyC3VBRnfUU9_qO1Gr1ARBO8BZLT-Sp6vFc";
var pageToken="",s="";
var allcnt=0,j=0,totalResults=0,resultsPerPage=0,total=0;
/* GoogleAPIロード後に呼び出される */
window.onJSClientLoad = function() {
dbg("★onJSClientLoad");
gapi.client.setApiKey(APIKEY);
gapi.client.load('youtube', 'v3', makeRequest);
};
var requestOptions = {
playlistId:PLAYLIST_ID,
part:"id, snippet, contentDetails, status"
};
/* APIリクエスト */
function makeRequest(){
dbg("★makeRequest:"+pageToken);
if(pageToken){
requestOptions.pageToken=pageToken;
}
var request=gapi.client.request({
mine:"",
path:"/youtube/v3/playlistItems",
params:requestOptions
});
request.execute(function(resp) {
dbg(resp);
if(resp.error){
$("#message").html(resp.error.message);
}else{
output(resp,pageToken);
}
});
}
/* HTML出力 */
function output(resp,pageTokenFLG){
pageToken=resp.nextPageToken;
if(pageTokenFLG==""){
var pageInfo=resp.pageInfo;
resultsPerPage=resp.pageInfo.resultsPerPage; /* APIレスポンスに含まれる結果の数 */
totalResults=resp.pageInfo.totalResults; /* 結果セット内の結果の合計数 */
total=Math.floor(totalResults/resultsPerPage);
if(totalResults<=resultsPerPage){
total=1;
}else if(totalResults%resultsPerPage!=0){
total++;
}
dbg("total:"+total+"/resultsPerPage:"+resultsPerPage+"/totalResults:"+totalResults);
s+="<li>pageInfo:<ul>";
s+="<li>結果セット内の結果合計数:"+pageInfo.totalResults+"</li>";
s+="<li>1レスポンスに含まれる結果数:"+pageInfo.resultsPerPage+"</li>";
s+="<li>リクエスト回数:"+total+"</li>";
s+="</ul></li>";
$("#results").append("<h2>Playlist</h2><ul>"+s+"</ul>");
s="";
}
itemOutput(resp.items);
allcnt++;
if(allcnt<total){
makeRequest();
}else{
$("#results").append("<h2>Items</h2><ul>"+s+"</ul>");
}
}
function itemOutput(items){
$.each(items, function(i, item){
j=(allcnt*resultsPerPage)+i+1;
/* id */
s+="<li><b>id:"+((item.id)?item.id:"no id")+"</b><ul>";
/* snippet */
if(item.snippet){
var snippet=item.snippet;
s+="<li><b>snippet</b>:<ul>";
s+=(snippet.channelId)?"<li>チャンネルID（channelId）:"+snippet.channelId+"</li>":"";
s+=(snippet.channelTitle)?"<li>チャンネルタイトル（channelTitle）:"+snippet.channelTitle+"</li>":"";
s+=(snippet.playlistId)?"<li>再生リストID（playlistId）:<a href='http://www.youtube.com/playlist?list="+snippet.playlistId+"'>"+snippet.playlistId+"</a></li>":"";
s+=(snippet.position>=0)?"<li>再生リスト内の動画の位置（position）:"+snippet.position+"</li>":"";
s+=(snippet.publishedAt)?"<li>公開日（publishedAt）:"+snippet.publishedAt+"</li>":"";
s+=(snippet.resourceId.kind)?"<li>リソース種類（resourceId.kind）:"+snippet.resourceId.kind+"</li>":"";
s+=(snippet.resourceId.videoId)?"<li>動画ID（resourceId.videoId）:<a href='http://www.youtube.com/watch?v="+snippet.resourceId.videoId+"'>"+snippet.resourceId.videoId+"</a></li>":"";
s+=(snippet.description)?"<li>動画の説明文:"+snippet.description+"</li>":"";
s+=(snippet.title)?"<li>動画タイトル（title）:"+snippet.title+"</li>":"";
if(snippet.thumbnails && snippet.thumbnails.default.url){
/* default, medium, high */
s+="<li><img src='"+snippet.thumbnails.default.url+"' /></li>";
}
s+="</ul></li>";
}
/* contentDetails */
if(item.contentDetails){
s+="<li><b>contentDetails</b>:<ul>";
var contentDetails=item.contentDetails;
s+=(contentDetails.videoId)?"<li>動画ID（videoId）:"+contentDetails.videoId+"</li>":"";
s+="</ul></li>";
}
/* status */
if(item.status){
var status=item.status;
s+="<li><b>status</b>:<ul>";
s+=(status.privacyStatus)?"<li>動画のステイタス:"+status.privacyStatus+"</li>":"";
s+="</ul></li>";
}
s+="</ul></li>";
});
}
var dbg=function(str){
try{
if(window.console && console.log){
console.log(str);
}
}catch(err){
//alert("error:"+err);
}
}
</script>
<script src="https://apis.google.com/js/client.js?onload=onJSClientLoad"></script>
<link rel="stylesheet" type="text/css" href="/common/css/example.css"></head>
<body id='example3' class='example'><div class="ads" style="margin:32px auto;text-align:center;"></div><h1 class='h'><a href='/'>PHP & JavaScript Room</a> :: 設置サンプル</h1>
<h3 class='h'>実行結果</h3>
<h1>設置サンプル：[YouTube API(v3) - 再生リスト内の動画情報取得（認証なし）</h1>
<div id="results"></div>
</body>
</html>