Why CDN are disabled in local my chrome browser? - javascript

I often my test javascript snippet code using Chrome developer tools and I came up with debugging of inputing URL search bar: data:text/html, and running code chrome snippets.
This way works in Vue.js's CDN though some strange error message occurs.But,jQuery via CDN doesn't load like photo.
I want to know reason why these happens.Any tips would greatly help.
So,please give me advise if something occurs to you however it is little.
Edit:
I added photo load jquery snippets and it works in Google Home.
My html environment is reproducible only inputting your chrome browser's url_bar,data:text/html, <html contenteditable> which makes your browser html-editor and it can run javascript using script tag.

It is because your code is loading jQuery without a protocal ( http://, https:// ). The code you have loads the resource based on what your page uses for maximum security. Your page doesn't have use http:// or https:// unless it is online.
Change it to http:// and it will load, but if you're using SSL and your page is loading through https:// when online, then change it back to :// when it's online.

Related

Deeplink to Facebook App (using fb: protocol) not working from Facebook in-app browser

I am writing a mobile web page which has both a redirect and two manual backup links (for when the redirect doesn't work) to a Facebook Page.
The link takes the form:
fb://page/[PAGE ID NUMBER]
The redirect and link work in Chrome Mobile and Firefox Mobile but (surprise) they don't work in Facebook Browser which, instead, gives me the error:
Page can't be loaded.
I am perplexed that a link to the Facebook App doesn't work from within the Facebook Browser.
How can I resolve this? Are there any creative solutions or workarounds... or have I missed something obvious?
Additional Info: It looks like the redirect is working in at least one version of the Facebook Browser on the Facebook iOS App. So the issue may be isolated to the Facebook Android App.
UPDATE 1
I've made some progress. I've discovered that Facebook's in-app browser doesn't always (or doesn't ever?) acknowledge / load / execute external script files.
Added: (To find out why not, see Update 8, below...)
In this case the href attributes in the links were being re-populated with fb:// protocol links by an external script after page load.
I have moved the relevant javascript functions from the external script to the bottom of the actual page. I have tested the functions and I can see they are now activating. Although the links still don't work.
UPDATE 2
It struck me that there may be some security mechanism going on behind the scenes which doesn't allow for any javascript-driven re-population of href attributes and that instead of the fb:// protocol links not working, it was maybe the case that the initial, default http://www.facebook.com/ links were never even being replaced and it was those http:// protocol links that weren't working.
So I updated the PHP template, so that the initial default links were the fb:// instead of the http:// links (so nothing in the page delivered to the Facebook in-app browser would need to be updated by any client-side script at all at any point).
Nope. Still not working.
UPDATE 3
I added a plain vanilla link to the bottom of the page, linking to the site's homepage. The link functioned entirely normally.
Later, I pointed the original links to an external domain. They didn't work.
So... I concluded that only http:// protocol links to the same domain would work and that's why the links wouldn't work if they pointed to an external domain or to an fb:// protocol address.
Wrong conclusion.
I pointed the original links at the site's homepage and they still didn't work.
UPDATE 4
In a moment of inspiration, I removed the reference to the external script which I'd set up to customise the links to the OS + browser environment (even though this script reference was being entirely ignored by Facebook, according to the FB Debugging tool.
The links worked.
So the reason why the plain vanilla link I had added earlier had worked, was nothing to do with where it was pointing and simply to do with the fact that at no point had a script tried to access it or update it.
Added: (This isn't the reason. See Update 8, below...)
I pointed the original links at the external domain. They worked.
I pointed the original links at the fb:// protocol. They didn't work.
UPDATE 5
Now that I've got rid of the external script reference, I can point the original protocol links at any http:// protocol address and they work.
Including the http://www.facebook.com web equivalent of the page I am trying to open in the Facebook App.
Let's review that:
The Facebook website is opening in the Facebook in-app browser.
I know, right?
UPDATE 6 [.HTACCESS REDIRECT]
I changed the link destination to /fb-custom-redirect/.
Then I added a line to the mod_rewrite section of my .htaccess file:
RewriteRule ^fb-custom-redirect fb://page/[PAGE ID NUMBER]
Naturally the server didn't understand what I was asking for.
UPDATE 7 [PHP REDIRECT]
I created an index.php for /fb-custom-redirect/ and added the following:
<?php
header('Location: fb://page/[PAGE ID NUMBER]');
?>
Guess what? This works in Firefox Mobile. It also works in Chrome Mobile.
But in the Facebook in-app browser, it returns the same error:
Page can't be loaded.
UPDATE 8
I've only just discovered - and this is not insignificant - that when the Facebook Debugger Tool (https://developers.facebook.com/tools/debug/sharing/) refreshes Facebook's cache of a given page, it only refreshes the .html.
Pressing Scrape Again does not refresh any external resources like .css and .js files.
Instead Facebook continues to refer to its own cached versions of those files, regardless that the .html file cache has just been updated.
The workaround (in PHP, at least) is to append the filepath with a new, randomly generated query string every time the page is loaded:
<link rel="stylesheet" href="/styles/mystyles.css?'.uniqid().'" />
Now the Facebook in-app browser is fetching up-to-date versions of my .css and .js files.
This explains my initial observation in Update 1:
I've made some progress. I've discovered that Facebook's in-app
browser doesn't always (or doesn't ever?) acknowledge / load / execute
external script files.
I'm going to conclude that the Facebook in-app browser was parsing the external .js file reference every time, but it was repeatedly accessing an old, cached version of that file.
Nevertheless, even after all the hypotheses and experimenting above, I'm still no closer to discovering why fb: protocol deeplinks don't work in the Facebook App's in-app browser.
I give up.
Apple apps are sandboxed. This means they cannot access other apps and execute code. Facebook is running a browsing instance and when you try to call the fb:// protocol, the iPhone is blocking you from doing this to try to create an infinite app loading loop. I.e, you open a page in FB browser and it opens itself in FB browser and it opens itself in FB browser...

How To Detect Which Javascript Code is Causing the Page Redirection?

I am using a template downloaded from the internet which is completely free but the website from where i downloaded has added a link back to its homepage at the footer of the template. When i try to remove that particular link, my page redirects to its homepage URL.
How do i know which code is causing the page redirection?
I have already tried searching for its homepage URL in the source code, but i didn't find that. Can i monitor the JavaScript activities? If so how?
I also tried looking for third-party script linked to the document, unfortunately there are so many documents linked which makes it even harder to figure out the actual script.
Assuming there's a window.location.replace or window.location.href somewhere, try inspecting the page, switch off your internet connection and grab the error line from your Console or Network tab. It worked for me using Firefox Developer Tools.

issue with jsbin editor while using openlayers3 js library

I am learning OpenLayers 3 and I ran into a problem while trying to pull in basemaps to the browser using a JS Bin online editor.
If I write the exact same code in a local text editor (Notepad++) everything works as it should. But not when I am using JS Bin.
Here is the link with the code:
https://jsbin.com/wijoha/edit?html,css,console,output
Can you help me figure out what is wrong with it? I've already spent a couple of hours trying to solve the issue but can't get my head around it...
Looking at the console on the JSBin you have added (the browser window's one, rather than the JSBin one), the CSS is not being loaded as you are attempting to put a HTTP resource into a HTTPS page. The error message reads:
Mixed Content: The page at 'https://null.jsbin.com/runner' was loaded over HTTPS, but requested an insecure stylesheet 'http://openlayers.org/en/v3.10.1/css/ol.css'. This request has been blocked; the content must be served over HTTPS.
Additionally, your JS file ol.js is not loading at all, as openlayers.org does not seem to be accepting serving the file over HTTPS (for me at least, in Chrome).
Instead, try serving everything over HTTP (including the URL of JSBin itself), here is a working example:
http://jsbin.com/focoxoxabo/edit?html,css,console,output

Relative Links Not working on HTML page

There is an issue I am facing in HTML page.
I have included a javascript code in that page due to which ActiveX warning message is thrown each time the HTML page is uploaded on local system.
To stop this warning being shown to the users, I have used MOTW (Mark of the Web) and included this code snippet at the top of the HTML Page:
<!-- saved from url=(0016)http://localhost-->
This line of code prohibits the warning prompt message.
But now the relative URLs on the page have stopped working.
Please help me find me a solution so that neither the ActiveX warning arises nor the relative links on the page should stop working.
Thanks in advance.
The ActiveX warnings should only arise when you are accessing your site from the local file system, for security reasons. When you access it through a (local or remote) web server the warnings should be gone.
Can you not use Apache (included in XAMPP), or something similar, to serve your pages (even locally, through http://localhost/)?
Edit:
Alternatively, you could disable that particular security setting in Internet Explorer (which I assume you use, because you mention ActiveX). Or you could try a different browser: Firefox, for example, does not have these restrictions.
Have you tried using a <base href="ENETERBASEURLHERE" />

Wordpress not loading javascript file

I have just uploaded a wordpress site from previously developing it on my localhost. On my localhost there are several plugin javascript files that are picked up and used to display a tooltip on the google map plugin for the markers.
On my localhost this all works fine but when i uploaded this through FTP, some of the javascript files appear to longer be loaded. Is there any way to check which files are being uploaded when the page is loading the javascript?
Whenever i try to check or edit the file from Filezilla, it gives a Microsoft JScript runtime error, Code: 800A1391, Error: 'document' is undefined, so i can't check that what the host uses is the exact same code as my localhost.
Many thanks,
Dan
Most browser developer toolkits (Dragonfly, Chrome Developer Tools, Firebug, etc) include a Net tab which will tell you which files have been requested and the status of them.
Try using either firebug http://getfirebug.com/ with Firefox or the Chrome web inspector and look at the (Net/Network) panel while you reload the page to see if the js files are trying to load. This should give you some insight.

Categories