在 Javascript 中使用 document.domain 的同源策略解决方法

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2404947/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 00:09:59  来源:igfitidea点击:

Same-origin policy workaround using document.domain in Javascript

javascriptsame-origin-policy

提问by Rubix

I am running into same-origin policy issues in Javascript. I've read about a workaround for this using the document.domainvariable, but I cannot get the workaround to work. The workaround is that you are supposed to be able to set document.domainto 'example.com'so that if you run code from foo.example.comit can load data via XHR from bar.example.com.

我在 Javascript 中遇到了同源策略问题。我已经阅读了有关使用该document.domain变量的解决方法,但我无法使该解决方法起作用。解决方法是您应该能够设置document.domain为,'example.com'以便如果您从中运行代码,foo.example.com则可以通过 XHR 从bar.example.com.

Details on the workaround are here:

有关解决方法的详细信息,请参见此处:

https://developer.mozilla.org/En/Same_origin_policy_for_JavaScript

https://developer.mozilla.org/En/Same_origin_policy_for_JavaScript

My example code -- which doesn't produce the desired results -- is run from a URL like http://foo.example.com/:

我的示例代码——它不会产生想要的结果——是从一个像下面这样的 URL 运行的http://foo.example.com/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<script>
document.domain = 'example.com';
window.onload = function() {
    var req = new XMLHttpRequest();
    var url = 'http://bar.example.com/';
    req.open('GET', url, true);
    req.onreadystatechange = function (aEvt) {
        if (req.readyState == 4) {
            var elem = document.getElementById('result');
            if (req.status == 200) {
                var data = req.responseText;
            } else {
                var data = "Error loading page: " + req.status;
            }
            elem.innerHTML = data;
        }
    };
    req.send(null);
};
</script>
Result:<hr>
<div id="result"></div>
</body>
</html>

The output from this code:

此代码的输出:

Result:
Error loading page: 0

If I change urlto 'http://foo.example.com/', everything works correctly. Is there a bug in my example code?

如果我更改url'http://foo.example.com/',则一切正常。我的示例代码中是否有错误?

I don't want to use a proxy because they're slower, less efficient, and will increase traffic on our web server. It'd be really cool if this workaround actually worked. Is this workaround "pie in the sky"?

我不想使用代理,因为它们速度较慢,效率较低,并且会增加我们 Web 服务器上的流量。如果这种解决方法真的有效,那就太酷了。这种解决方法是“天上掉馅饼”吗?

采纳答案by Jordan Parmer

Since Mic answered why it doesn't work, I thought I'd share the solution to "how" to make cross-domain work. See my SO post here.

由于麦克风回答了为什么它不起作用,我想我会分享“如何”使跨域工作的解决方案。在此处查看我的 SO 帖子。

回答by Mic

document.domainallows the communication between frames/iframes. Not XHR.

document.domain允许帧/iframe 之间的通信。不是 XHR。

<body>
<iframe src="http://bar.example.com/"></iframe>
<script>
    document.domain = 'example.com';
    var ifr = document.getElementsByTagName('IFRAME')[0];
    ifr.onload = function(e){
        //will log the string "BODY" in the console
        console.log(ifr.contentWindow.document.body.tagName);
    };
</script>
</body>

If you remove the line with document.domain, reading the content of the contentWindow will throw the Same Origin Policy error.

如果删除带有 的行document.domain,读取 contentWindow 的内容将引发同源策略错误。