.htaccess 部署后React应用程序CORS错误

yruzcnhs 于 2023-05-29 发布在 React

关注(0)|答案(1)|浏览(217)

我用REACT和Express开发了一个系统。它在当地运行良好。当我部署到CPanel时，我得到了子路由器刷新的404错误，所以我像这样添加了.htaccess。

<IfModule mod_rewrite.c>
   Options -MultiViews
   RewriteEngine On
   RewriteCond %{REQUEST_FILENAME} !-f
   RewriteRule ^ index.html [QSA,L]
</IfModule>

在我添加了这个之后，当我用axios调用后端API时，我得到了一个CORS错误。
请帮帮我

更新

如果我添加.htaccess，我得到这个错误。
Access to XMLHttpRequest at 'https://api.lightcoin.io/api/history?user=0x1C09d124d6c03EF63B1e0C3D1Af1b2eFE628ceE8' from origin 'https://lightcoin.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
如果我删除.htaccess，它工作得很好，但当子路由器的页面刷新时，我得到了404错误。

.htaccess

来源：https://stackoverflow.com/questions/72634714/react-app-cors-error-when-after-deployment

1条答案

按热度按时间

0ejtzxu11#

添加.htaccess文件后遇到的CORS错误可能是由于服务器设置中的错误配置造成的。您提供的.htaccess文件旨在通过将所有请求重定向到index.html文件来处理单页应用程序（SPA）的客户端路由，该文件允许客户端路由处理相应的页。
要解决CORS错误，您需要配置服务器以在响应中包含适当的CORS标头。你可以这样做：
打开.htaccess文件，并在现有规则之前添加以下行：

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Methods "GET, POST, OPTIONS"
    Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept"
</IfModule>

保存.htaccess文件并将其上传到服务器。

赞(0）回复(0）举报 2023-05-29

我来回答

.htaccess 部署后React应用程序CORS错误

1条答案

相关问题

热门标签

最新问答