Unable to retrieve data from http site to https using XMLHttpRequest()

Question

I have a site hosted on https:// in which I want to pull data from the site which shows the properties of the shares. The URL which returns the data is:

http://ir1.euroinvestor.com/asp/ir/xmlirmultiiso2.aspx?companyid=281191

The code which I have developed to get the data is as follows:

function GetSharesUpdate(){
    // makeing AJAX calls to the web service for getting the share update    
    var xhr = new XMLHttpRequest(); // Set up xhr request
    xhr.open("GET", "http://ir1.euroinvestor.com/asp/ir/xmlirmultiiso2.aspx?companyid=281191", true);   // Open the request
    xhr.responseType = "";   // Set the type of response expected    
    xhr.send();
    //  Asynchronously wait for the data to return
    xhr.onreadystatechange = function () {
        if (xhr.readyState == xhr.DONE) {
            var tempoutput = xhr.responseXML;
            alert(tempoutput);
        }
    }
    //  Report errors if they happen
    xhr.addEventListener("error", function (e) {
        console.error("Error: " + e + " Could not load url.");
    }, false);       
}

I am getting the error on the statement xhr.send(); which is as below:

Mixed Content: The page at ' https://[SiteUrl] ' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint ' http://ir1.euroinvestor.com/asp/ir/xmlirmultiiso2.aspx?companyid=281191 '. This request has been blocked; the content must be served over HTTPS.

If I change the URL to https ie

https://ir1.euroinvestor.com/asp/ir/xmlirmultiiso2.aspx?companyid=281191

then xhr.send(); is executed without any error but I am getting xhr.responseXML null.

What should I make changes in my code to make it working?

Answer 1

The first problem is you are doing ajax request to non-https domain but your domain has SSL installed.

The second problem is Cross origin request CORS , you will have this problem even you solve first (ie. even you try ajax request from non-http domain).

Since you are requesting data from another website this is most likely to happen unless the requested server is configured to serve requests for you domain To solve this you need to call the data from your server(proxy server) or have the requested server configured to allow requests from your domain.

See more - https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS