仅当 url 以 www 为前缀时才会发生 CORS 错误

Question

我目前遇到一个关于 CORS（跨域资源共享）的问题，奇怪的是这似乎只在我使用 www 为我的网址添加前缀时发生。

例如，当我使用 url 访问我的网站时：“http://example.com/index”一切正常并且所有资源都已正确加载。但是，当我尝试使用网址“http://www.example.com/index”访问我的网站时，我收到错误Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://example.com/index. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

我尝试加载的资源是一个使用以下代码的 XML 文件：

function loadXML()
{
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            xmlData = xhttp.responseXML;
            initStartShot();
        }
    };
    xhttp.open("GET", "http://example.com/XML/someXMLfile.xml", true);
    xhttp.send();
}

我所有的资源文件都与我的页面在同一个域中。

我已经四处寻找issues related to mine，但大多数都是关于 CORS 的，以及如何让它工作。但看到我没有任何没有“www”前缀的CORS问题这一事实似乎不适用于我的问题。

很遗憾，我无法分享网址本身，但如果您需要任何其他信息，我会尽力提供。

任何帮助将不胜感激。

~雷米

Answer 1

example.com 和 www.example.com 是不同的来源。要成为同源，URL 方案、主机名和端口必须相同。 www.example.com 和 example.com 不是同一个主机名。

默认允许 JavaScript 访问同一来源的数据。

您收到有关缺少 CORS 权限的错误，因为您尝试从另一个源访问一个源。

有几种方法可以解决这个问题。

• 首先不要使用多个来源。选择 example.com 和 www.example.com 之一作为规范。配置您的 HTTP 服务器以发出 301 重定向，从非规范重定向到规范重定向。
• 使用相对 URL。您的绝对 URL 意味着当您位于错误的来源时，它仍会尝试访问另一个来源。使用相对 URL 将使请求保持与页面相同的来源。
• 将您的服务器配置为使用 CORS 标头向其他来源授予权限。

我推荐第一个选项。

Answer 2

在查看我的 SO 帖子时，我实际上发现了问题，因此为了将来参考，我将回答我自己的问题：

在我的 XML 下载器中，我使用了静态路径 xhttp.open("GET", "http://example.com/XML/someXMLfile.xml", true); 而不是相对路径 ../XML/someXMLfile.xml，我还不清楚为什么“www.example.com”和“example.com”被视为不同的域，但这解决了我的问题。

编辑：根据@Daniel_Gale 他的评论，使用 location.hostname 也可以。