AJAX from HTTP to HTTPS

Question

On my page I have the FORM with one INPUT field. On SUBMIT this form I use JavaSript function "test_kod(this)" to valid is the the entered value correct or not. But in the Internet Explorer ver <=9 the OPEN method always fall with error "access denied". WHAT AM I DOING WRONG? PS Because of some limitations I cant use JQUERY.

function test_kod(field) {
  var req = createXMLHTTPObject();
  if (!req) { 
    return false;
  };
  try {
  //in IE <= 9 in this place debuger always return error "access denied" 
  req.open("GET","https://dad-atlas.datasolutions.pl/karta.php?karta="+field.value,false);
  }
  catch(e){
    return false;
  }
  req.setRequestHeader('User-Agent','XMLHTTP/1.0');
  req.onreadystatechange = function () {
    if (req.readyState != 4) return;
    if (req.status != 200 && req.status != 304) {
      return false;
    }
    if (req.responseText == "TAK") {
      return true;
    } else {
      return false;
    };
  }
  if (req.readyState == 4) return;
  req.send();
}

var XMLHttpFactories = [
function () {return new XMLHttpRequest()},
function () {return new ActiveXObject("Msxml2.XMLHTTP")},
function () {return new ActiveXObject("Msxml3.XMLHTTP")},
function () {return new ActiveXObject("Microsoft.XMLHTTP")}
];

function createXMLHTTPObject() {
var xmlhttp = false;
for (var i=0;i<XMLHttpFactories.length;i++) {
try {
xmlhttp = XMLHttpFactories[i]();
}
catch (e) {
continue;
}
break;
}
return xmlhttp;
}

EDIT

I digged in the NET and changed my script to use the XDomainRequest. It works good, but only if the url request has HTTP protocol. When I try to use url request with HTTPS protocol, in IE I still have the "access denied" error.

My new script.

function test_kod(field) {
  var xhr = createCORSRequest('GET', "https://dad-atlas.datasolutions.pl/karta.php?karta="+field.value);
  //var xhr = createCORSRequest('GET', "http://facebook.com");
  if (!xhr) {
    alert('CORS not supported');
    return false;
  }
  // Response handlers.
  xhr.onload = function() {
    var text = xhr.responseText;
    var title = getTitle(text);
    alert('Response from CORS request to ' + url + ': ' + title);
  };

  xhr.onerror = function() {
    alert('Woops, there was an error making the request.');
  };

  xhr.send();
}

// Create the XHR object.
function createCORSRequest(method, url) {
  var xhr = new XMLHttpRequest();
  if ("withCredentials" in xhr) {
    // XHR for Chrome/Firefox/Opera/Safari.
    xhr.open(method, url, true);
    alert("Firefox open");
  } else if (typeof XDomainRequest != "undefined") {
    // XDomainRequest for IE.
    xhr = new XDomainRequest();
    xhr.open(method, url);
    alert("IE open");
  } else {
    alert('CORS not supported');
    xhr = null;
  }
  return xhr;
}

// Helper method to parse the title tag from the response.
function getTitle(text) {
  return text.match('<title>(.*)?</title>')[1];
}

Answer 1

You are making a cross-origin request. Since it is working on browsers that are not IE9, presumably you have set up CORS to grant permission (although pulling HTTPS data onto an HTTP page renders the encryption pretty much worthless).

IE doesn't support CORS with XMLHttpRequest until IE 10. Before then you need to use XDomainRequest instead. Its use is documented on MSDN .

I'd move the HTML document over to HTTPS instead since that will solve both the cross-origin and the security issues at the same time.