Same origin policy, external script - javascript

I'm reading about the same origin policy. I understand that the js on my page should not have access to methods (and more) defined in a js resource on a different domain. However, I must be misreading this. In my website, I have a script reference to the jquery library at the code.jquery.com domain,
<script src='http://code.jquery.com/jquery-1.8.2.js'></script>
and everything in that library is available to the js scripts on my site.
So, what am I misunderstanding here?

The same-origin-policy says that you are not allowed to use objects etc. declared in another domains i.e. in an iframe.
It does not forbid to load a script from a domain and run the code locally. The variables in the jquery script are not from another domain, you just loaded the source code from there.

Same Origin Policy affects iframes and XHRs, img and canvas, among other things.
Pointing a script src to a different host, protocol or port is not in violation with this. This is useful, as we can use a CDN to serve the files and use JSONP for data transfer (before CORS can be used everywhere - thanks < IE8).

Related

Does the same origin policy allow you to use ajax to request the current file with the file:// protocol?

If I have an html page I'm loading at the path file://some/path/whatever.html, can javascript in that file download whatever.html and examine it? I know the same origin policy disallows access to other files, but I'm not clear on whether it also bars access to the current file when using the file:// protocol.
In short: does the same origin policy disallow any access to file:// protocol paths?
I looked at mdn's documentation on this, but it doesn't make it clear.
It depends on the browser.
I've been able to do this in Firefox (using AJAX with jQuery, there might be an easier way), but not in Chrome, which doesn't allow access to local files to JavaScript.
EDIT: just learned that you can launch Chrome with the --allow-file-access-from-files parameter, which should enable this behavior.

How does JavaScript load external libraries?

I'm a bit confused on how JavaScript is able to load external libraries. Is it doing a GET request to the url I specify in the script tags? Does the browser handle the storage of the library or is it kept somewhere in the DOM?
It seems like most things that the browser might be doing with loading external libraries would violate the same-origin policy. Is there any extra security modern browsers enforce when loading scripts from external sites? Is it possible to load an external library and then print its source to the screen?
Thanks!
I'm a bit confused on how JavaScript is able to load external libraries.
JavaScript has no native means to load libraries. That is a feature provided by the host environment (such as a browser or node.js).
Is it doing a GET request to the url I specify in the script tags? Does the browser handle the storage of the library or is it kept somewhere in the DOM?
The browser will make a GET request, load the script into the JavaScript environment for the viewport, but only keep the HTMLScriptElement DOM Node in the DOM.
It seems like most things that the browser might be doing with loading external libraries would violate the same-origin policy.
The same origin policy is designed to protect non-public data on third party sites. Scripts aren't data (although they can be written so they have embedded data in them, JSON-P depends on this as a way to avoid the same origin policy).
Is there any extra security modern browsers enforce when loading scripts from external sites?
No
Is it possible to load an external library and then print its source to the screen?
No (although you can use XHR to make a separate HTTP request to get the script source — which is subject to the same origin policy).

Same-Origin Policy and serving JS from a CDN

I want to serve my JavaScript scripts from a CDN like cloudflare.
Now my scripts communicate with my app server via ajax. Wouldn't the same-origin policy restrictions come into play when I load these scripts from a CDN?
Let's say my app is on the domain:
http://app.com
And I load my scripts from
http://cdn.com/xyz/all.js
Now, since my scripts are loaded from a different domain than the domain my app is running from, I guess the same origin policy would prevent me from doing ajax communication with my app.
Am I getting something wrong?
No, it will work. That's why JSONP works. The "origin" of the script is the page it is executed in, not where it comes from.
As you asked for it, here's a reference (I couldn't find any better, but Crockford is well known)
The src attribute, surprisingly, is not constrained by the Same Origin Policy. This means that a script element can be created which can go to any server, fetch a script, and execute it. If the script causes the delivery of JSON-encoded data, then this is a very useful thing. Unfortunately, there is no way to constrain the script or to inspect it before it executes. It runs with the same authority as scripts from the page. So the script can access and use its cookies. It can access the originating server using the user's authorization. It can inspect the DOM and the JavaScript global object, and send any information it finds anywhere in the world. The Script Tag Hack is not secure and should be avoided.
http://javascript.crockford.com/script.html
Not really a reference: If this wouldn't work, nobody could include jQuery from Google's CDN and then use it's $.ajax method.

Browser Same Origin Policy

We have application hosted "xyz:8080/rootapp" and cometd services hosted on "xyz:9090/cometed". The JavaScript loaded from cometd server needs to access the DOM/JavaScripts loaded from (xyz:8080), the browser's same origin policy is not allowing it.
To overcome it we set 'document.domain' as "xyz" eliminating port. This solution is working well but this is becoming problem to all the iframes loaded by "xyz:8080" and I need to change each and every iframe to use domain as "xyz".
Can someone provide me hints to solve this problem without changing each and every iframe?
Do we have any http header to set domain?
You can use CORS to specify an exception to same origin, this will work in any relatively modern browser.
This page has a fairly good intro and a list of compatible browsers.
The short version is put an Access-Control-Allow-Origin header into the responses from xyz:8080 that contains either xyz:9090 or * (for unrestricted access).

Cross-domain if 2 scripts from same domain?

I have a JS file that puts an iframe on every site its on.
both the JS and the iframe location comes from the same domain, mine.
Can I somehow communicate from within the iframe to the outside script,
which isn't running on my domain, but is called from it?
I know about JSONP but i'm looking for a better way if possible
It's very simple. The location of the document needs to be served from the same domain as the location of the script. Otherwise, the script will get "Access Denied" error.
If you are supplying a script for other people to use, then you could have them load easyXDM which would allow your script to communicate with the document loaded in the iframe (if it also has the easyXDM library set up).
You would also have to require them to host a simple html file on their domain in case easyXDM cannot use postMessage and has to resort to using the hash/fragment solution.
Demos of this can be viewed here

Categories

Resources