youtube data api v3搜索 [英] youtube data api v3 search
问题描述
我正在尝试在我的weebly网站上使用youtube数据api v3中的关键字搜索，但我无法让它工作。我按照javascript代码示例页面上的说明进行操作。我已将auth.js文件和search.js添加到我的项目中，并将用户ID插入auth.js文件中。我将以下HTML代码插入到我的页面中，但它不起作用。代码有问题吗？我尝试将搜索按钮的已禁用属性更改为已启用，但仍然无效。如果它不是代码，是因为它是一个有趣的网站？任何建议或帮助将不胜感激。谢谢。
I'm trying to use the keyword search from the youtube data api v3 on my weebly site, but I can't get it to work. I followed the instructions on the javascript code samples page. I've added the "auth.js" file and the "search.js" to my project and I've plugged my user id into the "auth.js" file. I inserted the following HTML code into my page, but it doesn't work. Is something wrong with the code? I tried changing the "disabled" attribute of the search button to "enabled", but it still didn't work. If it's not the code, is it perhaps because it's a weebly site? Any suggestions or help would be appreciated. Thanks.
<!doctype html>
<html>
<head>
<title>Search</title>
</head>
<body>
<div id="buttons">
<label> <input id="query" value='cats' type="text"/><button id="search-button"
disabled onclick="search()">Search</button></label>
</div>
<div id="search-container">
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="auth.js"></script>
<script src="search.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady">
</script>
</body>
</html>
推荐答案
以下是一种方式：
<!doctype html>
<html>
<head>
<title>Search</title>
</head>
<body>
<div id="buttons">
<label> <input id="query" value='cats' type="text"/><button id="search-button" onclick="keyWordsearch()">Search</button></label>
<div id="container">
<h1>Search Results</h1>
<ul id="results"></ul>
</div>
<script>
function keyWordsearch(){
gapi.client.setApiKey('api_key_here');
gapi.client.load('youtube', 'v3', function() {
makeRequest();
});
}
function makeRequest() {
var q = $('#query').val();
var request = gapi.client.youtube.search.list({
q: q,
part: 'snippet',
maxResults: 10
});
request.execute(function(response) {
$('#results').empty()
var srchItems = response.result.items;
$.each(srchItems, function(index, item) {
vidTitle = item.snippet.title;
vidThumburl = item.snippet.thumbnails.default.url;
vidThumbimg = '<pre><img id="thumb" src="'+vidThumburl+'" alt="No Image Available." style="width:204px;height:128px"></pre>';
$('#results').append('<pre>' + vidTitle + vidThumbimg + '</pre>');
})
})
}
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"> </script>
</body>
</html>
这篇关于youtube data api v3搜索的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
