Javascript 为什么js和html代码没有运行搜索查询？_Javascript_Html_Youtube Api

Javascript 为什么js和html代码没有运行搜索查询？

javascript html youtube-api

Javascript 为什么js和html代码没有运行搜索查询？,javascript,html,youtube-api,Javascript,Html,Youtube Api,我正在尝试使用Youtube的api，并运行搜索查询来检索找到的视频。当我运行js或html时，没有打印任何内容。身份验证密钥是正确的。当我运行js文件时，它所说的一切都是[在0.4s中完成]。当我运行html文件时，没有显示任何内容 js文件 function showResponse(response) { var responseString = JSON.stringify(response, '', 2); document.getElementById('response').inn

我正在尝试使用Youtube的api，并运行搜索查询来检索找到的视频。当我运行js或html时，没有打印任何内容。身份验证密钥是正确的。当我运行js文件时，它所说的一切都是

[在0.4s中完成]

。当我运行html文件时，没有显示任何内容

js文件

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('hidden');

search();
 }

function search() {

var request = gapi.client.youtube.search.list({
    part: 'snippet',
    q: 'dog'
});


request.execute(onSearchResponse);
 }

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

搜索html代码

<!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>

默认情况下，视频链接的返回值是json响应格式中的视频ID

"id": {
  "kind": "youtube#video",
  "videoId": "dgVKzvO5zNc"
}

您可以过滤json响应并创建一个类似于链接的变通方法，下面是一个示例：

request.execute(function(response) {

    var items = response.result.items;
    for(i in items){
        var vidID = items[i].id.videoId;
        var link = '<a href="http://youtube.com/watch?v='+vidID+'">' + "link"+[i] + '</a><br>';
        document.getElementById('search-container').innerHTML += link;
    }
  });

request.execute（函数（响应）{
var items=response.result.items；
（i）在项目中{
var vidID=items[i].id.videoId；
变量链接=“
”；
document.getElementById（'search-container'）。innerHTML+=link；
}
});

html文件

<!doctype html>
<html>
  <head>
    <title>Search</title>
  </head>
  <body>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="search.js"></script>
    <script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
    <div id="buttons"><input id="query" value='cats' type="text"/><button id="search-button" onclick="search()" >Search</button></label>
    </div>
    <div id="search-container">
    </div>
  </body>
</html>


搜寻
搜寻

您是否正在从服务器加载页面。。。本地主机还是其他？控制台中有任何错误吗？我正在系统上运行，我觉得这就是问题所在。我正在使用heroku作为我的服务器，我将如何在heroku上运行它？系统上的

是什么意思？从文件打开：//
协议？是意味着我目前没有使用任何本地主机或服务器，那么由于浏览器中的安全限制，ajax请求将被阻止。在计算机上设置本地主机服务器或上载到服务器