【问题标题】:Cannot read property 'search' of undefined - Youtube API无法读取未定义的属性“搜索” - Youtube API
【发布时间】:2017-01-03 16:24:11
【问题描述】:

在尝试使用 JS 与 Youtube API 交互时,我似乎遇到了这个错误。这是我收到的控制台错误。

Uncaught TypeError: Cannot read property 'search' of undefined
at HTMLFormElement.<anonymous> (app.js:7)
at HTMLFormElement.dispatch (jquery-2.2.4.min.js:3)
at HTMLFormElement.r.handle (jquery-2.2.4.min.js:3)

这是我用来交互的脚本。

    function tplawesome(e,t){res=e;for(var n=0;n<t.length;n++){res=res.replace(/\{\{(.*?)\}\}/g,function(e,r){return t[n][r]})}return res}

$(function() {
    $("form").on("submit", function(e) {
       e.preventDefault();
       /* prepare api request */
       var request = gapi.client.youtube.search.list({
            part: "snippet",
            type: "video",
            q: encodeURIComponent($("#search").val()).replace(/%20/g, "+"),
            maxResults: 3,
            order: "viewCount",
            publishedAfter: "2015-01-01T00:00:00Z"
       }); 
       /* execute the request */
       request.execute(function(response) {
          var results = response.result;
          $("#results").html("");
          $.each(results.items, function(index, item) {
            $.get("tpl/item.html", function(data) {
                $("#results").append(tplawesome(data, [{"title":item.snippet.title, "videoid":item.id.videoId}]));
            });
          });
          resetVideoHeight();
       });
    });

    $(window).on("resize", resetVideoHeight);
});

function resetVideoHeight() {
    $(".video").css("height", $("#results").width() * 9/16);
}

function init() {
    gapi.client.setApiKey("myapikey");
    gapi.client.load("youtube", "v3", function() {
        /* check if api is ready */
    });
}

最初帮助我编写脚本的人告诉我,除非它在实际的网络服务器(如 Apache)上,否则它有问题,但我是这样,所以我不明白是什么导致了问题。有什么想法吗?

【问题讨论】:

  • 嗨,你从哪里引用gapi? YouTube 对象似乎是未定义的。 API 访问密钥是否具有正确的凭据?这需要在 Google 控制台上创建新应用程序时进行设置。
  • 它在我的 HTML 的底部,对此感到抱歉。它肯定也是在 Google 控制台中设置的,这让我很困惑。
  • 问题可能与 client.load 异步有关,并且当 API 未准备好时调用 searchstackoverflow.com/questions/24586072/…。它看起来也不像 init 被调用过。如果您在页面加载时调用它应该没问题,因为在表单提交之前搜索不会运行。
  • 你能举个例子吗?抱歉,除了我的任务之外,JS 真的一点都不好。
  • 您也可以发布 HTML 吗?

标签: javascript youtube


【解决方案1】:

您的问题似乎是缺少对 init 方法的任何调用。在$("form").on("submit", function(e) { ...上方添加行init();

我已经尝试过了,但收到了一个未经授权的异常,正如您对无效 API 密钥所期望的那样。

【讨论】:

  • Uncaught ReferenceError: init is not defined
  • 这是我的示例,直到出现未经授权的错误:jsfiddle.net/bensnaize/mznj8sw5/1
  • 这就是它吸引我的地方。未捕获的 ReferenceError:在 Object.fireWith [as resolveWith] (jquery-2.2.4. min.js:2) 在 Function.ready (jquery-2.2.4.min.js:2) 在 HTMLDocument.J (jquery-2.2.4.min.js:2)
猜你喜欢
  • 2014-01-04
  • 2017-12-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-11-06
  • 1970-01-01
  • 2016-05-24
相关资源
最近更新 更多