XMLHttpRequest cannot load "url". Origin null is not allowed by Access-Control-Allow-Origin

Question

I am trying to call a web service from javascript. In Internet Explorer 9 works properly, while chrome does not work. The error is as follows:

"OPTIONS http://www.restfulwebservices.net/wcf/CurrencyService.svc?wsdl 400 (Bad Request) XMLHttpRequest cannot load http://www.restfulwebservices.net/wcf/CurrencyService.svc?wsdl. Origin null is not allowed by Access-Control-Allow-Origin."

I leave the code for help me. Thanks. ` function SOAPClient() { this.wsdl = ''; this.async = true; this.action = ''; this.xml = '';

            SOAPClient.prototype.invoke = function(){
                var xhr;
                if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xhr = new XMLHttpRequest();
                } else {// code for IE6, IE5
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }


                xhr.onreadystatechange=function() {
                    if (xhr.readyState >= 3){
                        alert ('ReadyState '+xhr.readyState+' - - Status '+xhr.status);
                        if(xhr.status == 200)
                            document.getElementById("txtResult").innerHTML=xhr.responseText;
                        else
                            document.getElementById("txtResult").innerHTML='Error';
                    }
                }
                xhr.open("POST", this.wsdl,this.async);
                xhr.setRequestHeader("SOAPAction", this.action);
                xhr.setRequestHeader("Content-Type", "text/xml");
                xhr.setRequestHeader("Connection", "close");
                xhr.send(this.xml);
                return false;
            }
        }
    </script> 
    <script type="text/javascript"> 
        var wsdl = 'http://www.restfulwebservices.net/wcf/CurrencyService.svc?wsdl';
        var action = 'GetConversionRate';           
        var xml = '';
        var async = true;
        var response = '';

        function prueba(){              
            var client = new SOAPClient();
            client.wsdl = wsdl;
            client.action = action;
            client.xml = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:ns="http://www.restfulwebservices.net/ServiceContracts/2008/01"><soapenv:Header/><soapenv:Body><ns:GetConversionRate><ns:FromCurrency>EUR</ns:FromCurrency><ns:ToCurrency>GBP</ns:ToCurrency></ns:GetConversionRate></soapenv:Body></soapenv:Envelope>';
            client.invoke();
            return false;
        }   
    </script>
</head>
<body>
    <p>Versión 2.5</p>
    <form name="form" action="#">
        Term: <input type="text" name="inputValue" method="post"/>
        <button onclick="prueba()">Search</button>
        <p id="txtResult"></p>
    </form>
</body>

`

Is the web service you are calling hosted on the same domain as the code calling it? See here for more info: http://stackoverflow.com/questions/5224017/origin-null-is-not-allowed-by-access-control-allow-origin-in-chrome-why — HaukurHaf, May 17 '12 at 13:20
possible duplicate of [XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin](http://stackoverflow.com/questions/3595515/xmlhttprequest-error-origin-null-is-not-allowed-by-access-control-allow-origin) and [**many** others](http://stackoverflow.com/search?q=Origin+null+is+not+allowed+by+Access-Control-Allow-Origin) — Quentin, May 17 '12 at 14:27

apsillers · Answer 1 · 2012-05-17T14:26:53.547

First, your request must either:

abide by the same-origin policy (i.e., requesting domain == receiving domain), or
be exclipity permitted to access the service's pages by a Access-Control-Allow-Origin header that lists your domain as a domain allowed to access that server in a cross-domain way.

Furthermore, you are making the request from a file:// document, and Chrome might disallow it from performing any cross-domain XHR, even if the server gives back an all-permissive Access-Control-Allow-Origin: *. You should run a local server to access your files through HTTP, or simply test in a different browser.

score 0 · Answer 2 · edited May 23 '17 at 12:11

If you're on a different domain you must, as stated above, set the Access-Control-Allow-Origin header. It also sounds like your not handling the OPTIONS request that is made at all by your application. This is just an additional request made by the browser when the type of request isn't of GET or POST. All you'll be doing is returning headers with the proper Access-Control-Allow-Origin permissions to let the browser know it's permitted to make the cross domain request. I'm not sure what you're using in the background, but see this post to see how it was done in Rails. How to be aple to POST, PUT and DELETE from Backbone app to Rails app on different subdomains?

XMLHttpRequest cannot load "url". Origin null is not allowed by Access-Control-Allow-Origin

2 Answers2