使用Javascript的YouTube数据API v3

我对编写代码和使用API有点陌生。我不完全清楚为什么我的程序没有按我希望的方式运行

我想让它做的是在控制台中提供搜索结果，然后我才能开始下一步的工作；然而，我不认为有人在搜查任何东西

根据这个：，唯一需要的参数是“part”，所以我认为我做的一切都对吗？但可能不是，因为从我所知道的，当我试图搜索一个术语时，没有任何东西被搜索。 这是我的密码：

HTML:

文件
输入名称：

JavaScript:

  $(document).ready(function(){

  $('#search-term').submit(function(event){
    event.preventDefault();
    var searchTerm = $('#query').val();
    getRequest(searchTerm);
  });


function getRequest(searchTerm){
  var params = {
    "q": "searchTerm",
    "part": 'snippet',
    "type": 'video',
    "key": 'I was advised to keep my key private, so I edited this part out'
  }
  url = 'https://www.googleapis.com/youtube/v3/search';

  $.getJSON(url, params, function(data){
    showResults(data.items);
   })
}

function showResults(results){
  var html = "";

  $.each(results, function(index,value){
    html += '<p>' + value.snippet.thumbnails.high.url + '</p>' + '<p>' + 'https://www.youtube.com/watch?v=' + value.id.videoId + '</p>' + '<hr/>';
    console.log(value.snippet.thumbnails.high.url);
    console.log(value);
  })
  $('#search-results').html(html);
}
})

$（文档）.ready（函数（）{
$（“#搜索词”）.submit（函数（事件）{
event.preventDefault（）；
var searchTerm=$（'#query'）.val（）；
getRequest（搜索术语）；
});
函数getRequest（searchTerm）{
变量参数={
“q”：“搜索术语”，
“部分”：“片段”，
“类型”：“视频”，
“密钥”：“有人建议我将密钥保密，因此我删掉了此部分”
}
url='1〕https://www.googleapis.com/youtube/v3/search';
$.getJSON（url、参数、函数（数据）{
展示结果（数据项）；
})
}
函数showResults（结果）{
var html=“”；
$.each（结果、函数（索引、值）{
html++=''+value.snippet.thumbnails.high.url++'
'+''+'https://www.youtube.com/watch?v=“+value.id.videoId+”
“+”
；
log（value.snippet.thumbnails.high.url）；
console.log（值）；
})
$（“#搜索结果”）.html（html）；
}
})

您可能需要

数据。项目

而不是

数据。搜索

我没有看到在他们的文档中列出的“响应”部分中提到任何“搜索”参数。请参见此处的响应属性：

因此，如果

console.log（数据），您可能会看到一些输出而不是
数据。搜索


我建议您检查一下，这可能不是您的最佳解决方案，但值得一试

使用
gapi.client.youtube.search.list的示例：

// After the API loads, call a function to enable the search box.
function handleAPILoaded() {
  $('#search-button').attr('disabled', false);
}

// Search for a specified string.
function search() {
  var q = $('#query').val();
  var request = gapi.client.youtube.search.list({
    q: q,
    part: 'snippet'
  });

  request.execute(function(response) {
    var str = JSON.stringify(response.result);
    $('#search-container').html('<pre>' + str + '</pre>');
  });
}

//加载API后，调用函数以启用搜索框。
函数handleAPILoaded（）{
$（“#搜索按钮”）.attr（'disabled'，false）；
}
//搜索指定的字符串。
函数搜索（）{
var q=$（'#query'）.val（）；
var request=gapi.client.youtube.search.list({
问:问,，
部分：“代码片段”
});
请求.执行（函数（响应）{
var str=JSON.stringify（response.result）；
$（“#搜索容器”）.html（“”+str+“”）；
});
}
它向您的控制台输出了什么？出于某种原因，它只是说“未定义”。我会在输入框中输入一些东西，也就是搜索框，然后按“回车”键。控制台上只显示“未定义”。请您只添加
console.log（数据）就在上面，看看我们是否得到了什么？：）它起作用了！非常感谢。你知道为什么我从console.log（数据）而不是console.log（数据.search）得到了一些东西吗？这可能是一个愚蠢的问题，但我对这些东西还是新手：）最后一个问题。我编辑了我的原始帖子以反映最新的代码。我本来打算开始一个全新的问题，但我想我应该把它放在这里，这样我就可以把所有的东西“放在一起”；然而，无论我在输入框中输入什么，都不会改变。例如，如果我搜索苹果或比萨饼，我会得到完全相同的结果。我猜这与使用“stringify”有关。我认为这是因为我们正在将信息从浏览器发送到服务器。如果这是正确的，你对我应该怎么做有什么建议吗？我在这方面运气不好。@午餐盒：
“q”：“searchTerm”
改为
“q”：searchTerm，
。。为了使用变量，它不能在引号中：）我想当您使用.getJSON时，键必须在双引号中？我应该删除params中所有内容的双引号吗？或者只是问？@午餐盒没有其他一切看起来都很好。要理解数组或对象的“键”就是它的索引。在这种情况下，键是
“q”
，该值将被设置为
searchTerm
变量的值（传递给函数）-因此，如果您的输入框中填充了
橙子
，它最终将与
“q”相同：“橙子”
，希望这有意义：）是的，我误解了你第一次键入的内容哈哈，谢谢，现在一切都很好！
// After the API loads, call a function to enable the search box.
function handleAPILoaded() {
  $('#search-button').attr('disabled', false);
}

// Search for a specified string.
function search() {
  var q = $('#query').val();
  var request = gapi.client.youtube.search.list({
    q: q,
    part: 'snippet'
  });

  request.execute(function(response) {
    var str = JSON.stringify(response.result);
    $('#search-container').html('<pre>' + str + '</pre>');
  });
}