document.domain is the same yet still getting same-origin errors

Question

I have some javascript that looks like this:

// https://secure.example.com
document.domain = "example.com";
window.myVar = "value";

// http://example.com
document.domain = "example.com";
var iframe = document.body.appendChild(document.createElement("iframe"));
iframe.onload = function () {
    console.log(iframe.contentWindow.myVar);
}
iframe.src = "https://secure.example.com";

I'm trying to access myVar from https://secure.example.com by loading it into an iframe in http://example.com. Note the usage of http and https. When both domains used http or https this worked, but now I would like to have one use http and the other to use https. I've stepped through the code to verify that document.domain is set correctly. Why is this happening?

Answer 1

Your issue is not domain or host. Your issue is protocol

You cannot set document.domain across protocols

http and https are NOT the same origin due to protocol, just like example.com:80 is NOT the same origin as example.com:8080 due to ports.

There are VERY good security reasons to not be allowed to mix http and https

Please read https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy