weblog

当サイトでは、アフィリエイト広告を利用しています。

YouTube APIと JavaScriptクライアント ライブラリ の使い方

概要

YouTube Data API v3 は、公開データの検索であれば APIkey を取得すれば可能。動画のアップロードなどプライベートデータにアクセスする場合は、Auth2.0 の認証が必要。

JavaScript クライアント ライブラリは、これらの操作を JavaScript で行う時に便利なライブラリ。

準備

Google Cloud Console で、アプリ登録。YouTube Data API のステータスを ON 。APIkey を取得。

公開データ検索など、認証なし APIkey のみ

HTTPリクエスト

GET https://www.googleapis.com/youtube/v3/search?part=snippet&q=cat&key={_API_KEY_}

  • part: 必須項目。id と snippet のどちらかか両方をカンマ区切りで
  • q: 検索クエリ。URIエンコードする。上記例では、cat を指定。
  • key: APIkey 。指定しないとリクエストが通らない。

結果は、JSON 形式。よって、XMLHttpRequest と JSON.parse をゴニョゴニョすれば良いがクライアント ライブラリを使ってみる。

JavaScript クライアント ライブラリ

基本

onload イベントを定義して、ライブラリをロードするスクリプトタグでコールバックする。

<script>
function callback(){
// ここに onload イベント
}
</script>
<script src="https://apis.google.com/js/client.js?onload=callback"></script>

具体例

キーワード検索。認証なし。APIkey のみ

<!doctype html><html lang="ja"><head>
<meta charset="utf-8">
<script>
//--- step4 html に結果を出力
function appendResults(text) {
var results = document.getElementById('results');
results.appendChild(document.createElement('pre'));
results.appendChild(document.createTextNode(text));
}
//--- step3 search.list をリクエスト
function makeRequest() {
var request = gapi.client.youtube.search.list({
'q': 'cat',
'part': 'snippet'
});
request.then(function(response) {
var str = JSON.stringify(response.result);
appendResults(str);
}, function(reason) {
console.log('Error: ' + reason.result.error.message);
});
}
//--- step2 APIkey をセット。YouTube API version3 をロード。
//--- makeRequest をコールバック
function init() {
gapi.client.setApiKey('_APIkey_');
gapi.client.load('youtube', 'v3').then(makeRequest);
}
</script>
//--- step1 client.js を呼び init をコールバック
<script src="https://apis.google.com/js/client.js?onload=init"></script>
</head>
<body>
<div id="results"></div>
</body>
</html>

これでクライアントライブラリが読み込まれるとコールバック関数が順に実行される。


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください