如何修复 ajax 请求的跨域请求被阻止（在 Firefox 中）？答案

【问题标题】：How to fix Cross-Origin Request Blocked for ajax request (in Firefox)?如何修复 ajax 请求的跨域请求被阻止（在 Firefox 中）？
【发布时间】：2017-06-08 22:36:21
【问题描述】：

我从 Firefox 中的 ajax 请求中收到以下错误：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://www.example.org/php/save.php. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

我试图找出发生这种情况的原因。很奇怪，因为

脚本在同一服务器上的子域上运行良好
访问的文件在同一台服务器上

我也试过了

xhttp = new XMLHttpRequest({mozSystem: true});

这里建议：https://stackoverflow.com/a/22392080

但这也无济于事。

我正在使用以下命令打开请求：

xhttp.open('POST', '/php/save.php', true);

当文件在另一台服务器上时，我找到了许多其他解决方案：

<IfModule mod_headers.c>
  Header set Access-Control-Allow-Origin "*"
</IfModule>

但是如果文件实际上在同一台服务器上，我不明白为什么要这样做......

编辑

我从.htaccess 文件中删除了以下两行，现在它可以工作了。

RewriteCond     %{HTTP_HOST}    !^www\.example\.org$                        [NC] 
RewriteRule     .?              http://www.example.org%{REQUEST_URI}        [R=301,L]

虽然我不确定为什么...也许添加www. 就像移动到子域一样？

我必须向我的.htaccess 文件添加什么才能使其与 ajax 和重写一起使用？

【问题讨论】：

How to fix Cross-Origin Request Blocked for ajax request (in Firefox)? - 对于所有浏览器来说都是一样的......服务器需要允许 CORS......对于 POST 请求，有一个预检发生，服务器也必须正确响应...阅读一些 CORS 文档
on the same server 是什么意思？
除非目标允许它。
@JaromandaX：当文件位于子域的另一个文件夹中时，我不明白为什么这没有问题？
@Daniel - 我也没有，因为我无权访问您的服务器来检查它在每种情况下发出的标头 - 可以使用其他方法使子域运行，但同样，我看不到你所有的代码，所以我想你必须做一些研究和调试

标签： javascript ajax

【解决方案1】：

出于安全原因，浏览器会限制从脚本中发起的跨域 HTTP 请求。例如，XMLHttpRequest 和 Fetch 遵循同源策略。因此，使用 XMLHttpRequest 或 Fetch 的 Web 应用程序只能向自己的域发出 HTTP 请求。

要跨不同域启用您的请求，您可以：

启用跨域资源共享（推荐）

CORS 是一种标准机制，所有浏览器都可以使用它来实现跨域请求。您指定一组允许浏览器和服务器通信的标头。

有用的资源： http://enable-cors.org/

使用反向代理。
使用 JSONP（仅在需要读取数据时才有效）。

【讨论】：

谢谢。但问题是我不是从另一个域请求材料。所以我不明白这是如何适用的。

【解决方案2】：

这就是解决我的问题的方法 - 虽然我不知道为什么。而不是我使用之前使用的重写：

RewriteCond %{HTTP_HOST} !^www\.example\.org$ [NC]
RewriteRule ^(.*)$ http://www.example.org/$1 [R=301,L]

【讨论】：