Google WebSearch Custom API Search Throws TypeErrors

Question

We have a custom search bar on our website, and I noticed that sometimes (9/10 times) JS throws this error, which causes the content you were looking to not display

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

Error search page:

Truncated / resolved search page

But if I were to update or research, this error will be surpassed and will display all my requests. After looking at the file, I found out that google.search.Search.apiary#### , which they are talking about, is mentioned only once. Therefore, I believe that this error truncates the entire file when it appears. What could be the reason for this, what would be some options for fixing it?

Answer 1

Ok, I came across the answer: -

After several studies, I found that this user in Google forums also has the same problem.

Simply put, how this works, you use <script> to create your search bar.

You have this function + html element for your search bar

 <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> 

So, we created a bar in our <div class="header"> , which is a HAML element as part of the template. Therefore, it was always loaded into every header. Since we have 10 pages, this same script was created 1 time per page.

Our Google CSE is created for search, and then redirected to URL /search-results , where it generates results.

To generate the results, you need this function and 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> 

This is the same as the one loaded in our header. With this setting, the results page will call this <script> twice at startup and cause a JS break. Therefore, after removing the <script> load of the results, he stopped throwing an error.

To make this concise, just make sure you don't call the same function twice on the results page, and it should clear up Uncaught TypeError .

Not. Reiteration. Independently

- ether

Answer 2

In my case, I accidentally and the script for Google Custom Search repeated twice on the same page. As soon as the second batch was deleted, it stopped giving an error.