我刚刚完成了关于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').
我也遇到了同样的问题，但在使用Xampp时解决了。你要做的就是在你的机器上安装xampp，然后找到它的目录。之后你会发现一个名为"htdocs"的文件夹。只需将包含js和HTML文件的文件夹移到此文件夹中即可。现在，您必须打开Xampp控制面板，然后单击Apache和SQL server的启动按钮。现在打开你的浏览器，输入网址：
http://localhost/"（包含两个页面的htdocs目录名）"
在此之后，单击.html文件，您就完成了。