APIの結果に基づいてYouTube動画を埋め込む

YouTube APIを使用してYouTube動画をウェブページに埋め込むことを試みています。これまでは、APIを使用して検索基準「dog」に基づいて結果を収集することができました。これらの結果を埋め込み動画に変換するにはどうすればよいですか。今は結果をindex.htmlページにJSONファイルとして表示しています。また、これは、自分のHTMLファイルとJavaScriptファイルがサーバー上でホストされている場合にのみ機能します。これはローカルで行う方法ですか？APIの結果に基づいてYouTube動画を埋め込む

ご協力いただきありがとうございます、またよろしくお願い致します。

HTML：

<html> 
    <head> 
     <script src="javascript.js" type="text/javascript"></script> 
     <script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script> 
    </head> 
    <body> 
     <pre id="response"></pre> 
    </body> 
</html>

はJavaScript：

function showResponse(response) { 
    var responseString = JSON.stringify(response, '', 2); 
    document.getElementById('response').innerHTML += responseString; 
} 

function onClientLoad() { 
    gapi.client.load('youtube', 'v3', onYouTubeApiLoad); 
} 

function onYouTubeApiLoad() { 
    gapi.client.setApiKey('API_KEY'); 

    search(); 
} 

function search() { 
    var request = gapi.client.youtube.search.list({ 
     part: 'snippet', 
     q:"dogs", 

    }); 


    request.execute(onSearchResponse); 
} 

function onSearchResponse(response) { 
    showResponse(response); 
}

出典

2016-04-03 HoumyM

検索結果から動画を表示するには、ビデオIDとiframeのHTMLタグを使うことになるでしょう。ここには完全な指示videoと、働いているsampleがあります。独自のAPIキーを提供する必要があります。
nodejsのようなサーバーを設定します。 localhostを使用しているので、GDCのHTTP refferrerにhttp://localhost:port_number（8080など）を追加します。 http reffererのポート番号が8080の場合は、nodejsのポート番号も8080にする必要があります。
URLでプロジェクトを実行してください。http://localhost:4567/ViralVideos/index.htmlのようになります。希望を助ける:)

出典

2016-04-05 08:08:01 noogui

あなたの助けを借りてくれてありがとう。これは素晴らしい！ – HoumyM

prob mate :) – noogui

APIの結果に基づいてYouTube動画を埋め込む

答えて

関連する問題