IE8 XSS / Jquery Problem

Question

Everything works fine in Firefox and Chrome, but except IE8 (8.0.6001.18702)

This is the test code (jQuery 1.4.2) (same problem with $ .post):

$(function() { $.get("http://domain2.tld/some.php", {}, function(response) { alert(response); }); }); 

This code is executed in the domain1.tld and loaded from domain2.tld, thus:

 <script type="text/javascript" src="http://domain2.tld/test.js"></script> 

In IE8, I get a "Resolve Denial" message. I have tried so far without success:

1) add to domain1.tld (php code):

 header("X-XSS-Protection: 0"); 

2) disable the XSS filter in IE8 settings.

I am using the IE8 debugger and it shows an error on line 5113:

 xhr.open(type, s.url, s.async); 

If instead of calling $ .get (domain2.tld ...), I call $ .get (domain1.tld ...), there is no error that confirms to me that this is XSS "same origin policy", problem.

My only solution (I think) is to do this through a proxy (php code), but I would prefer not to do this, as this affects performance.

Does anyone know of an alternative / fix for this problem?

Note. Updating IE8 is not an option since I want to test it without updates.

A very similar problem for mine: http://forum.jquery.com/topic/jquery-ui-tabs-ie8-and-injecting-elements-into-dom

Answer 1

(I recommend checking the list that I am posting before this answer)

To make the process easier, I took the CORS plugin and modified it. You do not need to modify existing jQuery code if you just use $ .get and $ .post. I tested it in IE8 and it works as expected. For other browsers, regular jQuery calls will be used. You can even add this code on demand (with conditional tags). Read the original comments for more information. Hope this helps ...

Here is the code (save it, for example, as jquery.xdomain.js ):

 /* * XDR (non-XHR) extension functions for IE8+ * Based in CORS plugin (http://plugins.jquery.com/project/cors) * Modified by A.Lepe (www.alepe.com, Aug 2010) * * It supports calls using $.get and $.post only. * The main difference between the CORS plugin and this one are: * * 1) This method tries first to use XDR and if not available * will try to use XHR. This is to prevent any alert or * security message from IE. * * 2) To minimize size and target only IE8+ versions, this method * does not provides an alternative fall-back. * CORS version uses proxy_xmlhttp.js as fall-back option (see link #1 below). * * If you want to support "OLD" browsers, an alternative fall-back * can be easily implemented (instead the error alert). * For example, something like: * * ... * } catch(e) { * data["proxy_url"] = url; * $._get(proxy, data, callback, type); * } * ... * * in which "proxy" must be a URL where your proxy is located. * Your proxy may look like: * * <?php //GET method example: $URL = $_GET["proxy_url"]; unset($_GET["proxy_url"]); $params = http_build_query($_GET); echo file_get_contents($URL."?".$params)); * ?> * * For POST method you may check link #2. * * NOTES: * * $.post() method it might not work as expected. XDR does * not send the data to the server in the same way XHR do * (am I missing something?). In order to have access to that * POST data you will need to: * * a) set: * always_populate_raw_post_data = On * register_long_arrays = On * * OR : * * b) import it manually (see link #3): //-------- Import XDR POST data --------- if (isset($GLOBALS["HTTP_RAW_POST_DATA"])) { $data = explode('&', $GLOBALS["HTTP_RAW_POST_DATA"]); foreach ($data as $val) { if (!empty($val)) { list($key, $value) = explode('=', $val); $_POST[$key] = urldecode($value); } } } * * Remember to add the respective headers in the server that will * allow the XDR calls: header('Access-Control-Allow-Origin: *'); //Or http://example.com header('Access-Control-Max-Age: 3628800'); header('Access-Control-Allow-Methods: GET, POST'); */ (function($) { $._get = $.get; $._post = $.post; $.get = function (url, data, callback, type) { // try XDR if (jQuery.browser.msie && window.XDomainRequest) { var params = ''; for (var key in data) { params += ((params || url.indexOf("?") != -1)?'&':'?')+key+'='+data[key]; } // Use Microsoft XDR var xdr = new XDomainRequest(); xdr.open("GET", url+params); xdr.onload = function() { callback(this.responseText, 'success'); }; xdr.send(); } else { try { // Try using jQuery to get data $._get(url, data, callback, type); } catch(e) { alert(e.message); } } } $.post = function (url, data, callback, type) { // Try XDR if (jQuery.browser.msie && window.XDomainRequest) { var params = ''; for (var key in data) { params += (params?'&':'')+key+'='+data[key]; } // Use XDR var xdr = new XDomainRequest(); xdr.open("POST", url); xdr.send(params); xdr.onload = function() { callback(xdr.responseText, 'success'); }; } else { try { // Try using jQuery to POST $._post(url, data, callback, type); } catch(e) { alert(e.message); } } } })(jQuery); 

References:

• proxy_xmlhttp.js
• PHP Post Method
• Import XDR data into PHP

Answer 2

I apologize if my English is not perfect, because I see that I am not clear enough ... One of my main problems is explained by another person here: http: // http: //forum.jquery.com/topic/cross-domain- ajax-and-ie

So what is the alternative?

1) XDomainRequest

Personally, I think this is the best way to implement cross-site scripting in IE8 + (since it is natively supported). The only problem is only Microsoft. But, like many other things with the IE family, we can easily extend the functionality of jQuery ajax.

According to the documentation, you need to specify some additional headers in domain1.tld, for example, in PHP as follows:

 header("Access-Control-Allow-Origin: http://domain2.tld"); //use * for any 

Perhaps the following alternative is useful for providing a jQuery XDomainRequest implementation;

Update (a): There is an XDR library (not jquery) that "replaces" the XHR class to make it a cross browser, it is based on the pmxdr client library . I have not tried it yet.

2) CORS

The only problem with this plugin is that it is not just an extension, since its functions are called differently, so you need to either change your codes or wrap this plugin.

Update (b): I modified the CORS plugin to simplify it. Check out my other answer to get the code.

3) JsonP in jQuery

This should be the easiest way to solve my problem (since I have control over both servers). In fact, most browsers support cross-site scripting only if the json format is used (I believe xml can also be used). In this case, the function $ .getJSON () is used. To make it work, you need to specify (as indicated in the documentation) callback =? in the URL, for example:

 $.getJSON("http://domain2.tld/index.php?callback=?",funciton(res){ ... }); 

"?" after the "callback" is replaced by an identifier ... in your php file, you need to get this identifier and surround the Json code as follows:

 print_r($_GET["callback"])."(".json_encode($mydata).");"; 

(I got this example from here )

The problem with this method is that if you want to get only HTML, it should be inside the json object and thus make the process a bit more complicated and overwhelming.

4) jquery.jsonp plugin

If you need additional checks and functions to support inline JSONP in jQuery, try this plugin, which will also simplify the process.

5) xdomainajax

This plugin uses an interesting aproach using the YQL service of Yahoo, in which any web page (or part of it) can be converted to Json, which allows you to import it into javascript. This method is good for situations in which you cannot change the format of the original.

6) flXHR

This solution uses flash (swf) to achieve magic. I can say that this is a very fast way to achieve an almost complete cross-browser implementation (since it relies on flash support). This method may be ideal for sites where the flash will be present (for sure). However, if your site does not require flash memory, then this will become a major drawback, as users must have flash installed in order for this to work.

7) xdajax

This solution is based on the implementation of YUI along with the Flash approach.

8) If none of the previous options is suitable for you, remember that you can still use the old trick to insert a tag to import JS code.

9) Reducing IE security to a minimum also solves the problem. But I think it would be nice to have this message: "Please lower your security settings to use this site" ... lol

Hope this helps others in a similar situation.

Answer 3

I need to agree with jAndy here, it is very unlikely that you all work. The same origin policy is used ( http://en.wikipedia.org/wiki/Same_origin_policy ), it is best to write a local proxy server that will pass your polls script, and then allow the proxy server to make cross-domain calls.