YouTube API学院

时间:2015-02-27 16:36:05

标签: youtube youtube-api youtube-data-api

我刚刚完成了关于Codecademy的YouTube API教程,并成功地设法显示了与给定的' q'相关的结果。使用以下代码提供的控制台窗口中的值:

// Helper function to display JavaScript value on HTML page.
function showResponse(response) {
    var responseString = JSON.stringify(response, '', 2);
    document.getElementById('response').innerHTML += responseString;
}

// Called automatically when JavaScript client library is loaded.
function onClientLoad() {
    gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
}

// Called automatically when YouTube API interface is loaded (see line 9).
function onYouTubeApiLoad() {
    // This API key is intended for use only in this lesson.
    // See http://goo.gl/PdPA1 to get a key for your own applications.
    gapi.client.setApiKey('AIzaSyCR5In4DZaTP6IEZQ0r1JceuvluJRzQNLE');

    search();
}

function search() {
    // Use the JavaScript client library to create a search.list() API call.
    var request = gapi.client.youtube.search.list({
        part: 'snippet',
        q: "Hello",
    });

    // Send the request to the API server,
    // and invoke onSearchRepsonse() with the response.
    request.execute(onSearchResponse);
}

// Called automatically with the response of the YouTube API request.
function onSearchResponse(response) {
    showResponse(response);
}

和:

<!DOCTYPE html>
<html>
    <head>
        <script src="search.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>

我现在遇到的问题是我已经把这个代码放到我自己的本地文件中,目的是为了进一步理解并以适合我的方式操作它,但它只返回一个空白页面。我认为它适用于Codecademy,因为它们使用特定的环境,并且所使用的代码可能仅在该环境中工作,我很惊讶它们不会提供有关在给定环境之外使用它所需的更改的信息。希望有人可以对此有所了解?也许我完全错了,如果是这样的话,任何见解都会受到赞赏。

浏览器控制台输出:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('file://') does not match the recipient window's origin ('null').

1 个答案:

答案 0 :(得分:3)

我也有同样的问题但是当我使用Xampp时它已经解决了。你要做的是在你的机器上安装xampp然后找到它的目录。找到名为&#34; htdocs&#34;的文件夹后。只需将包含js和HTML文件的文件夹移动到此文件夹中即可。现在您必须打开Xampp控制面板并单击两者的开始按钮--Apache和SQL服务器。现在打开浏览器并输入URL:

http://localhost/&#34;(您的htdocs目录名称包含两个页面)&#34;

在此之后,单击.html文件,您就完成了。