javascript - Youtube API 仅在首页访问时加载

Question

我编写了一个小型移动网络应用程序来通过手机控制电脑上的 YouTube，但是使用 YouTube API 进行搜索时出现了一些奇怪的情况。第一次加载页面时，一切正常 - 输入搜索词，单击搜索并返回结果。

但是，如果我单击另一个页面然后返回，搜索将不再有效，并且我会在下面的搜索功能中看到“未捕获的类型错误:无法读取‘搜索’未定义的属性”。

我对 JavaScript 很陌生，所以请随意斥责代码，但我已经看到这个问题有一段时间了，尽管进行了很多谷歌搜索，但仍无法找到解决方案。

// Called automatically when JavaScript client library is loaded.

function onClientLoad()
{

// 
try
{
gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
}

// Called automatically when YouTube API interface is loaded.
function onYouTubeApiLoad()
{
gapi.client.setApiKey('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
}

function search(q) {
// Create api request and execute it

var request = gapi.client.youtube.search.list({
type: 'video',
        part: 'snippet',
        q: q
});
        // Send the request to the API server,
        // and invoke onSearchRepsonse() with the response.
        request.execute(onSearchResponse);
}

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

API 脚本的链接位于我的 search.aspx 页面中，如下所示:

<script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script>

JQuery 也在使用中，所以我不知道那里是否会引起任何有趣的事情，但如果有任何想法，我们将非常感激!

Answer 1

确保在执行 onYouTubeApiLoad() 后调用 search()。 如果您将 search() 绑定(bind)到点击事件，请确保在回调中执行此操作:

function onYouTubeApiLoad()
{
  gapi.client.setApiKey('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
  $("button#search").on("click", function(){ search(...); })
}