Google WebSearch API 自定义搜索抛出 TypeErrors

Question

我们的网站上有一个自定义搜索栏，我注意到有时（9/10 次）JS 会抛出此错误，这会强制您搜索的内容无法呈现

www.googleapis.com/customsearch/v1element?key=AIzaSyCVAXiUzRYsML1Pv6RwSG1gu…oogle.com&callback=google.search.Search.apiary####&nocache=1446053383742:2

Uncaught TypeError: google.search.Search.apiary#### is not a function

报错时搜索页面：

搜索页面有错误truncated/resolved

但如果我要刷新或研究，这个错误将被解决，并将呈现我的所有搜索。查看文件后，我发现他们所指的 google.search.Search.apiary#### 只提到了一次。所以我相信这个错误会截断整个文件 当它确实出现时 。可能是什么原因造成的，有哪些修复方法？

Answer 1

好吧，我偶然发现了一个答案：-

经过更多研究，我发现 this user on Google Forums 也有同样的问题。

简而言之，它的工作方式是使用 <script> 生成搜索栏。

您有此功能 + html 搜索栏元素

<script>
 (function() {
   var cx = '###';
   var gcse = document.createElement('script');
   gcse.type = 'text/javascript';
   gcse.async = true;
   gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
       '//cse.google.com/cse.js?cx=' + cx;
   var s = document.getElementsByTagName('script')[0];
   s.parentNode.insertBefore(gcse, s);
 })();
</script>

<gcse:searchbox-only resultsUrl="/search-results"></gcse:searchbox-only>

因此我们在 <div class="header"> 中生成了栏，这是一个 HAML 元素，作为模板的一部分。所以它总是在每个 header 中加载。由于我们有 10 页，因此每页生成 1 次相同的脚本。

我们的 Google CSE 用于搜索，然后重定向到生成结果的 url /search-results。

要生成结果，您需要此函数和 HTML

<script>
     (function() {
       var cx = '###';
       var gcse = document.createElement('script');
       gcse.type = 'text/javascript';
       gcse.async = true;
       gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
           '//cse.google.com/cse.js?cx=' + cx;
       var s = document.getElementsByTagName('script')[0];
       s.parentNode.insertBefore(gcse, s);
     })();
    </script>

这与我们 Header 中加载的相同。通过此设置，结果页面将在加载时调用 <script> 两次，并导致 JS 中断。所以在删除 <script> 加载结果后，它停止抛出错误。

简而言之，只要确保您没有在结果页面上两次调用相同的 function，它应该会清除 Uncaught TypeError.

不要。重复。你自己

--以太币

Answer 2

就我而言，我不小心让 Google 自定义搜索的 the form and script 在同一页面上重复了两次。一旦第二批被移除，它就停止给出错误。

Google WebSearch API 自定义搜索抛出 TypeErrors

Google WebSearch API custom search throws TypeErrors

javascript

google-search

google-search-api

google-custom-search