Custom search engine not working on android phone - javascript

I am running google custom search in browser it works fine. It runs fine even in emulator in Phonegap but it gives network error or it shows blank screen when the same is run on android phone. or gives this error "file:///google.com/cse?q=.... can not be found."
I am using google custom search v2 code.

The code you get for v2 of custom search looks something like this:
<script>
(function() {
var cx = 'ENGINE_ID';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>
What it roughly does is creating a tag like this:
<script type="text/javascript" src="http://www.google.com/cse/cse.js?cx=ENGINE_ID">
and inserts it before other scripts on your page. So you can skip this code altogether and manually insert the above tag (with your engine id) and only <gcse:search></gcse:search> to your HTML. If the connection from file:// to http:// is still not possible, download this script (http://www.google.com/cse/cse.js?cx=ENGINE_ID) and serve it as local javascript file.

I've encountered the same problem. An one-line change in JavaScript made the file:// error go away:
// This line must take place before initializing GCSE
window.IS_GOOGLE_AFS_IFRAME_ = true;
Verified on both iOS and Android Cordova environments.

Related

gapi.client is undefined -- firefox add-on sdk

Following these instructions: https://developers.google.com/+/web/api/javascript
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client:plusone.js?onload=signin';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
Inserted before the tag...
The gapi object that is available inside the signout() callback does not include gapi.client .. in fact, I am getting gapi.client is undefined as a JS error.
I cannot call gapi.client.load('drive', 'v2', callback) since the client property is undefined.
This issue is only when using Firefox Add-on SDK and using cfx run to open a browser with the add-on I am developing being a sidebar element.
Can anyone tell me what I am doing wrong? Can provide more information if necessary!

Youtube iframe API fails to post message

For awhile now, a piece of javascript I wrote which listens to youtube actions on a certain page worked wonderfully. I am using Youtube's iframe js api: https://developers.google.com/youtube/iframe_api_reference .
But one recent content addition, a specific youtube video, the tracking wouldn't work. The events won't fire at all.
In the console, I noticed this post message error:
Unable to post message to http://youtube.com. Recipient has origin http://www.youtube.com.
So nothing with my own code helped. Some questions here on stackoverflow suggested this is an issue with initiating new YT.player too soon, so I tried a whole bunch of things like loading the yt js api file on window load and only apply the api after, but that didn't seem to do any good either.
I know this post is 3 years old, but for those who are still searching for an answer:
Add this script and everything works fine:
<script src="https://www.youtube.com/iframe_api"></script>
I've had the same problem with jwplayer and fixed it with that script.
It took me over an hour, but the answer was right in front of me. It's actually pretty self explained: You cannot use youtube's js api to track an iframe video without www. I don't know why, it certainly does not say so in their documentation.
I tested this a few times and confirmed, as of now, tracking an iframe with the source www.youtube.com/embed/0GN2kpBoFs4 would work wonderfully while tracking youtube.com/embed/0GN2kpBoFs4 will throw:
Unable to post message to http://youtube.com. Recipient has origin http://www.youtube.com.
The confusing part of course is that both the video load and play fine. It's only the API which is not working properly.
fiddle - http://jsfiddle.net/8tkgW/ (Tested on chrome / mountain lion)
Btw, while writing this answer I came across YouTube iframe API: how do I control a iframe player that's already in the HTML? - notice this guy's fiddle. He wrote his own youtube iframe implementation (wow!). If you change the iframe source address in the fiddle to one without www, it will work. This only means youtube writes bad js. Bad bad bad!
Don't forget to add it to the whitelist:
<!-- Add the whitelist plugin -->
<plugin name="cordova-plugin-whitelist" source="npm" spec="*"/>
<!-- White list https access to Youtube -->
<allow-navigation href="https://*youtube.com/*"/>
The youtube api documentation recommend to load the api like this
var tag = document.createElement('script');
tag.src = "http://youtube.com/iframe_api";
tag.id = "youtubeScript";
var firstScriptTag = document.getElementsByTagName('script')[1];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
But getting this error:
Unable to post message to http://youtube.com. Recipient has origin http://www.youtube.com
Here is the best solution I found from [a now-dead site]:
So add this first at the top before calling the Api
if (!window['YT']) {var YT = {loading: 0,loaded: 0};}
if (!window['YTConfig']) {var YTConfig = {'host': 'http://www.youtube.com'};}
if (!YT.loading) {YT.loading = 1;(function(){var l = [];YT.ready = function(f) {if (YT.loaded) {f();}
else
{l.push(f);}};
window.onYTReady = function() {YT.loaded = 1;for (var i = 0; i < l.length; i++) {try {l[i]();} catch (e) {}}};
YT.setConfig = function(c) {for (var k in c) {if (c.hasOwnProperty(k)) {YTConfig[k] = c[k];}}};
var a = document.createElement('script');
a.type = 'text/javascript';
a.id = 'www-widgetapi-script';
a.src = 'https:' + '//s.ytimg.com/yts/jsbin/www-widgetapi-vflumC9r0/www-widgetapi.js';
a.async = true;
var b = document.getElementsByTagName('script')[0];
b.parentNode.insertBefore(a, b);})();}
//===========THEN=============================
function onYouTubeIframeAPIReady () {// do stuff here}

Javascript error & GET request failure from Google custom search

I've encountered an issue with a custom Google search engine I've integrated into my site. I have some other Google elements on the same page, such as the +1 button and G+ badge, but I've isolated and verified that the search element is, in fact, the culprit.
The problem is the following: the GET request for http://www.google.com/uds/api/ads/3.0/9f53ed6be164615d919d9e4bd4f7fe8d/search.I.js seems to fail (although searching the site still works). The dev console in Chrome says that the request is initiated by their jsapi on line 21 and has the following highlighted in red:
google.(anonymous function).d
(anonymous function)
I've tried multiple test scenarios, including inserting the search box on a completely barebones HTML page, but I get the same error. What is causing the request to fail? Is it simply something on their end (and thus unfixable)?
Edit: Relevant code
This is all taken verbatim from Google's code generators.
This goes right before </head>
<script>
(function() {
var cx = '004344714102800561193:mo5u_njahwy';
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
</script>
The search box code:
<gcse:searchbox-only></gcse:searchbox-only>
Search results page code:
<gcse:searchresults-only></gcse:searchresults-only>
Do you have an ad blocker installed like Adblock Plus? I'm getting this error when I run your code in JSFiddle:
Failed to load resource: net::ERR_BLOCKED_BY_CLIENT
It looks like that error is often caused by an ad blocker preventing the file from being loaded: Meta - What are these errors about in the Chrome console when visiting StackOverflow?

Google Webfonts (Loader) in IE8 or lower

I'm trying to load about 40 fonts for a web project. People will have the ability to choose between custom fonts in a web shop. I use the Web Font Loader from Google and it works well, except in IE8 and lower.
So I'm printing my php array with the correct font-families that the Webfont Loader needs to load from Google. If I try to load all 40 fonts, it works in all browsers except in Internet Explorer 8 and below.
If I limit my font-array to 6 fonts, then those 6 fonts get loaded. But when I just add one more font to the array IE8 can't load the fonts. I get a Bad Request in my "Network"-tab from the developer tools, yet my url in the http-request seems OK.
Somebody else had had this problem before? Is the length of a Request URL in a HTTP-Header limited in IE8 and below?
<script type="text/javascript">
WebFontConfig = {
google: { families: /*json_encode(php array here)*/ },
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
</script>
I also tried to paste all the families in one 'link'. But also.. a Bad Request in IE8 and below.
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family= /* families */">
The request with %7 as '|' and the response:
GET /css?family=Aclonica%7CAveria+Serif+Libre%7CBoogaloo%7CCandal%7CCantora+One%7CCapriola%7CCarter+One%7CChewy%7CCoda+Caption:800%7CComfortaa%7CCourgette%7CCreepster%7CCrete+Round%7CDamion%7CDays+One%7CFrancois+One%7CFredoka+One%7CGalindo%7CGloria+Hallelujah%7CIndie+Flower%7CIrish+Grover%7CJust+Me+Again+Down+Here%7CLeckerli+One%7CLobster+Two%7CLondrina+Solid%7CLove+Ya+Like+A+Sister%7CMcLaren%7CMiniver%7CPiedra%7CPlaster%7CPoiret+One%7CQuantico%7CRacing+Sans+One%7CRadley%7CRammetto+One%7CRevalia%7CSchoolbell%7CSmokum%7CSniglet%7CStint+Ultra+Condensed%7CSue+Ellen+Francisco%7CUbuntu+Mono%7CUltra%7CUnifrakturCook:700%7CWaiting+for+the+Sunrise%7CYesteryear HTTP/1.1
https://docs.google.com/open?id=0B4anyChu_EhkRFNmRmd3UGY4RlU
And what I think is really weird: I get the correct data back from Google in the ResponseBody..
https://docs.google.com/open?id=0B4anyChu_EhkdFVqVjFVUVhFRWs
Solved by loading 5 fonts at a time with WebFontLoader only in IE8 and below.
<script src="http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>
<script>
<?php
$splitArrays = array_chunk($families, 5);
foreach ($splitArrays as $id => $split) {
echo 'WebFont.load({google:{families: ' . json_encode($split) . '}});';
}
?>
</script>
Google Web Fonts don't work in IE8. This article also describes how loading several fonts via a '<link>' tag fails in IE8 - therefore this bug appears not to be specific to using the web fonts loader.

Why isn't Google Analytics script loading in some browsers?

I use default generated GA tracking code for my page:
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXX-1']);
_gaq.push(['_setDomainName', 'xxx.com']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
This code seems to work in most cases. However, the _utm.gif is not requested from some browsers, (namely, I noticed it in Chromium on Ubuntu and Firefox on Fedora). Actually, it appears that the ga.js script is not even loaded.
If I use the GA Debugger or locally saved script ( ga.src = 'ga.js'; ), the tracking works as expected even on mentioned browsers. Other tested OS-browser configurations works.
EDIT: As suggested in comments, I've tried to remove protocol resolution (i.e.: ga.src = 'http://www.google-analytics.com/ga.js') and scripts other then ga.js (to rule out conflicts). It didn't change the behavior in any way.
Any ideas what causes the problem and how to avoid it?
I tested the issue again today and everything appears to be working as it should.. I have no idea why..

Categories

Resources