How does 3rd party JavaScript work?

[skaterdav85]

If you include a JS file hosted on another server, the Google Maps script for example, how does your site using that JS communicate with server side scripts hosted on other servers when cross domain AJAX isn't allowed? For example, say you include the JS file for Google Maps hosted on Google's servers onto your page which is hosted on mysite.com. When you pan the map, the script is somehow communicating with stuff on Google's servers from your your domain (mysite.com) to retrieve more map images and other relevant data. The only way I can see this being achieved is through dynamic script element creation and using JSONP. Any thoughts? Thanks!

[boen_robot]

I think the JS file that defines the whole thing is allowed to communicate with Google's servers. It's just your scripts that are not allowed to interact with it. So when you include the script, you're including their server handling... you're just not allowed to hook into it. Google may process query strings in the JS URL, in which case you can call it with some parameters, though nothing beyond that. Still, if they allow THAT, you could continuously create and destroy the script element.Take this with a grain of salt, as I'm not sure of the exact API you're referring to, and how you're using it (I'm just guessing...).

[justsomeguy]

Even if they are bound by the same restriction, like you mentioned fetching images and JSONP are not restricted the same way.

[skaterdav85]

Take this with a grain of salt, as I'm not sure of the exact API you're referring to, and how you're using it (I'm just guessing...).

Im not referring to any specific API. I am just curious about the general process. Maybe later I will try using a JS file hosted on another server I maintain and see if it can access the server-side scripts on the same server. If not, I agree, the only way I can see data being passed back and forth is through creating script elements and passing small amounts of data as a query string through the src attribute of the script element.

[skaterdav85]

So I tested it out, and I dont think it works. I created a simple demo on JSBin: http://jsbin.com/idodol/edit#javascript,html The demo references a script on another server and the JS script has an ajax function that tries to make a request to a php file on that other server. However, I get an error that says: XMLHttpRequest cannot load http://www-scf.usc.edu/~dtang/ajax/example1.php?name=Mike. Origin http://jsbin.com is not allowed by Access-Control-Allow-Origin.

[JamesB]

the js file loads fine in the <script> tag, but ajax is the problem: the js code is running on domain "jsbin.com" (http://jsbin.com/idodol/edit#javascript,html),but ajax is attempting to open() a url on a different domain "usc.edu" (http://www-scf.usc.edu/~dtang/ajax/example1.php?name=Mike)

[thescientist]

I think this may answer your question. (The Script Tag Hack, at the bottom)http://javascript.cr...com/script.html

[skaterdav85]

Great summary on the <script> element. At the bottom of that link, it does say:

It can access the originating server using the user's authorization.

I'm just not sure how that is accomplished.

[skaterdav85]

So I found an article that explains how to do cross domain ajax. The solution is CORS (cross origin resource sharing). http://www.nczonline.net/blog/2010/05/25/cross-domain-ajax-with-cross-origin-resource-sharing/