まずはGoogle Developers ConsoleでAPIをONにする
サイドバー[API·と認証] > YouTube Data API v3 を検索、ONにする
参考:プロジェクトを作成して API サービスを選択する
APIキーを作成
サイドバー[認証情報] > 公開APIへのアクセス > 新しいキーを作成 > ブラウザキー で新規作成
リファラーには設置するページのURLを記述
JavaScriptで動画を検索する
今回はあるチャンネルの動画一覧を最新順で取得する
パラメータ
- part: snippet
- channelId: チャンネルのID(www.youtube.com/channel/****** の部分)
- order: date(日付順)
https://www.googleapis.com/youtube/v3/search?part=snippet&channelId=(チャンネルID)&order=date&key=(APIキー)
ドキュメントのどれを見ていいかわかりづらいけどここからAPIを試すと楽
参考:Search: list
こんな感じのJSONがゲットできる
{
"kind": "youtube#searchListResponse",
"etag": "\"IHLB7Mi__JPvvG2zLQWAg8l36UU/B7HTIgYFvqFP1W51kJxRs_VPTEs\"",
"pageInfo": {
"totalResults": 2,
"resultsPerPage": 5
},
"items": [
{
"kind": "youtube#searchResult",
"etag": "\"IHLB7Mi__JPvvG2zLQWAg8l36UU/9Q6jCT_HeHFfR4LxWgkefRtExOk\"",
"id": {
"kind": "youtube#video",
"videoId": "J9VsVp7n6mg"
},
"snippet": {
"publishedAt": "2009-08-05T10:45:24.000Z",
"channelId": "UCnUSZE-pn6_g2DQu_d78fyw",
"title": "ミニチュア風動画 - 福岡市中央区赤坂",
"description": "http://akihiro.jugem.jp/?eid=259.",
"thumbnails": {
"default": {
"url": "https://i.ytimg.com/vi/J9VsVp7n6mg/default.jpg"
},
"medium": {
"url": "https://i.ytimg.com/vi/J9VsVp7n6mg/mqdefault.jpg"
},
"high": {
"url": "https://i.ytimg.com/vi/J9VsVp7n6mg/hqdefault.jpg"
}
},
"channelTitle": "1977akihiro",
"liveBroadcastContent": "none"
}
},
{
"kind": "youtube#searchResult",
"etag": "\"IHLB7Mi__JPvvG2zLQWAg8l36UU/DeJNCRcU3l63qnGglawM3fqrD-A\"",
"id": {
"kind": "youtube#channel",
"channelId": "UCnUSZE-pn6_g2DQu_d78fyw"
},
"snippet": {
"publishedAt": "2009-08-05T10:42:18.000Z",
"channelId": "UCnUSZE-pn6_g2DQu_d78fyw",
"title": "Akihiro Koyanagi",
"description": "",
"thumbnails": {
"default": {
"url": "https://lh6.googleusercontent.com/-SY0gvXNZffo/AAAAAAAAAAI/AAAAAAAAAAA/YnViDwJiSzY/photo.jpg"
},
"medium": {
"url": "https://lh6.googleusercontent.com/-SY0gvXNZffo/AAAAAAAAAAI/AAAAAAAAAAA/YnViDwJiSzY/photo.jpg"
},
"high": {
"url": "https://lh6.googleusercontent.com/-SY0gvXNZffo/AAAAAAAAAAI/AAAAAAAAAAA/YnViDwJiSzY/photo.jpg"
}
},
"channelTitle": "1977akihiro",
"liveBroadcastContent": "none"
}
}
]
}
itemsを回して items->id->kind==="youtube#video"
であれば
items->id->videoId
が動画のID。
$.getJSON(
apiUrl,
{},
function(json) {
if (!json.items) return;
for(var i in json.items){
if (json.items[i].id.videoId && json.items[i].id.kind=="youtube#video"){
listVideo.push(json.items[i].id.videoId);
}
}
}
);