时间戳

首页 > 解决方案 > Apache2 服务器将 Access-Control-Allow-Origin 标头应用于每个响应，XHR 除外

reactjs - Apache2 服务器将 Access-Control-Allow-Origin 标头应用于每个响应，XHR 除外

问题描述

我正在测试使用 apache httpd 部署我的 CRA 应用程序。它正在使用外部 API，因此我需要配置 Access-Control-Allow-Origin 标头以允许这样做。

我添加了一条规则，用于将 Access-Control-Allow-Origin 标头添加到 .htaccess 文件。

.ht 访问：

Header always set Access-Control-Allow-Origin "*"

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

javascript http请求：

Axios.get(URL).then(successCallback).catch(errorCallback);

在我的本地主机上对服务器请求的响应将 Access-Control-Allow-Origin 设置为正确的值；但是，鉴于 Chrome 显示此错误，它对外部 API 发出的一个请求在响应中似乎根本没有此标头：

Access to XMLHttpRequest at '{URL}’ from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我检查了 httpd.conf 中是否启用了标头和重写模块。我已经阅读了有关启用此功能的所有各种指南，但没有取得任何成功。

标签： reactjsapache2axioscreate-react-app

解决方案

在我的本地主机上对服务器请求的响应将 Access-Control-Allow-Origin 设置为正确的值；但是，它向外部 API 发出的一个请求似乎在响应中根本没有此标头

localhost 上的服务器和外部 API 是不同的服务器。

本地服务器的配置文件不会影响远程服务器。

您需要配置该服务器以使用 CORS 授予权限。

推荐阅读