jQuery - How to remove cross domain limitation [duplicate]
Same Origin Policy
You are attempting to circumvent the Same Origin Policy. It is built into every browser and is not normally something you can or should want to disable/workaround/etc. It is a very important security contract between your site, the user, and the user's browser.
CORS (possible)
CORS allows your web server to tell browsers/clients that access to another domain is permissible. This is done by having the following HTTP header output by your web server
Access-Control-Allow-Origin: http://www.example.comIf you can not control your HTTP Headers, then you can not use CORS. Implementation of this is language/framework specific.
Please note that you should check to ensure browser compatibility as IE8/9 had limited support. Also be aware that this is a potential attack vector. It allows responses from 3rd party sites to execute XSS attacks if you use the response data irresponsibly.
JSONP(possible)
JSONP is a clever way to pass and fetch data between servers by dynamically adding a script tag with a src atrribute equal to "yoururl.com?<your parameter data>" to your page. It is the only legitimate way to accomplish such a feat without a web proxy (see below) or an applet (Flash/Java). However it does have its own security risks if you are not the provider of both ends of the request. Remember that JSONP allows the remote server to execute code within your context and you should be very careful who you give that power to.
"Vanilla" AJAX (not possible)
If you are not using the JSONP to fetch data then you are most likely attempting to use an AJAX request to fetch data. AJAX requests are also subjected to the Same Origin Policy. JavaScript libraries (e.g. jQuery, Prototype, Dojo, etc) can not circumvent this policy as base behavior for an Ajax Request. They can, however, support JSONP (which remember now, is not AJAX).
AJAX w/ Web Proxy (possible)
If you do want to request data from another server, you can forward your request. Your main site's server will be acting as a proxy. You will need to make an AJAX request to your own server, that server side code will then make a request to the other domain and then send the response to your script via the AJAX calls response.
This is a common pattern and it is detailed here as the Web Proxy Pattern and a pricture friendly Yahoo one here (but remember it's Yahoo specific, just take the general idea). It is however, server side language dependent. The overall implementation will be the same, however the code to do so will vary based on your server side language of choice (PHP, Ruby, Python, C, etc). Some languages will already have libraries/modules/etc to support such a pattern.
Flash (possible, non-default)
Flash in its default state does not support cross domain requests. It can be turned on in Flash7+ with cross-domain policy files, but is highly suggested against. Your script would have to interface w/ a Flash API wich would make the requests and return the data to your JavaScript.
Java Applet (possible, non-default)
Java is also subjected to the same origin policy, but has a similar work around to Flash as described here on its release.
Various other "hacks"
There are other hacks out there, but they generally require you to control both ends or have an agreed upon standard for communication. For example the 'window.name' hack. I don't suggest most of these methods.
Other Solutions
Another question similar to this has been asked. It outlines a few other methods that I did not cover: Ways to circumvent the same-origin policy
The Best Solutions
- CORS - if you trust the 3rd party
- Web Proxy - if you don't
A web proxy on your own domain can allow you to sanitize the data being retrieved, it offers your user's the most protection. However, if you do zero sanitation it is no more secure than any of the methods outlined here. If you do implement a web-proxy of some kind, make sure its requests are limited to and from the sites you wish. Else you will essentially be creating an open proxy, which could be abused by users if discovered and get you into legal trouble.
I had the same issue. Trying to get json from a server to wich I dind't had access (=> no JSONP).
I found http://benalman.com/projects/php-simple-proxy/ Add the php proxy to your server and do the ajax call to this file."Any GET parameters to be passed through to the remote URL resource must be urlencoded in this parameter."
$.ajax({ type: 'GET', url:'proxy.php?url=http://anyDomain.com?someid=thispage', dataType: "json", success: function(data){ // success_fn(data); }, error: function(jqXHR, textStatus, errorThrown) { // error_fn(jqXHR, textStatus, errorThrown); }});where proxy.php (the file from Ben Alman) is hosted in your domain
Alternative (which I found to be second best to this):http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
A rather tacky way of doing it would be what i've done below to enable cross site execution on a personal project
please note this would be done on the receiving server not the sending one
if ((isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') === FALSE) die('You shouldn\'t be here'); header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']); header('Access-Control-Allow-Methods: POST, GET, OPTIONS'); header('Access-Control-Max-Age: 1000'); header('Access-Control-Allow-Headers: Content-Type');if you want it to be a bit more secure you could do
if ((isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') === FALSE) die('You shouldn\'t be here');switch($_SERVER['HTTP_ORIGIN']){case 'domain.com':case 'whatever.com': header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']); header('Access-Control-Allow-Methods: POST, GET, OPTIONS'); header('Access-Control-Max-Age: 1000'); header('Access-Control-Allow-Headers: Content-Type');}Hope this helps it took me forever to figure it out lol.