Jquery ajax call from https to http

Question

I deployed my website in IIS with https protocol. It works fine with http but ajax jquery request is failed with https. (I simply call a http web api which returns json data)

NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://....."

Did you get the same kind of errors when deploying with https?

Remember that this code below works well when deploy with HTTP, but switch to HTTPS it went to error section

var dataGetter = {
    authenticate: function (username, password) {
        var getTokenUrl = "http://xxx";
        var getTokenParams = { "username": username, "password": password }
        var result = false;        
        $.ajax({
            type: "GET",
            url: getTokenUrl,
            data: getTokenParams,
            contentType: "text/plain",
            dataType: 'json',
            crossDomain: true,
            cache: false,
            success: function (result) {
                  // do something here
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(errorThrown);
                alert(XMLHttpRequest.responseText);
            },
            async: false
        });

        return result;
    }

Answer 1

You cannot. Its the basic implicit security in browsers which doesn't allow you to call a insecure link (http) from https page.

For example:, Google Chrome will give you following error:

Mixed Content: The page at '' was loaded over HTTPS, but requested an insecure resource ''. This request has been blocked; the content must be served over HTTPS.