Axios在纯js中可以GET请求，但在React中无法使用–CORS错误。 _编程开发

Axios在纯js中可以GET请求，但在React中无法使用–CORS错误。

创始人

2024-09-29 03:30:26

0次

问题的根源是跨源资源共享（CORS）错误，因为React运行在本地主机而不是远程服务器上，所以Axios在React中不能使用。

为了解决这个问题，必须通过将CORS标头添加到HTTP响应中，允许从不同源头发送的请求，或通过使用代理。

以下是使用代理的解决方案：

在项目根目录下创建"setupProxy.js"文件。
在"setupProxy.js"文件中加入以下代码：

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(
    '/api',
    createProxyMiddleware({
      target: 'http://example.com',
      changeOrigin: true,
    })
  );
};

上述代码创建了一个代理中间件，将"api"路径下的请求发向"http://example.com"，而不是本地服务器。

然后，更新Axios的请求路径为绝对路径加上"api"前缀：

axios.get('/api/some/resource')

这将直接将请求发送到代理，代理会将其重定向到目标服务器。

现在Axios应该可以在React中正常使用，因为代理解决了CORS问题。

上一篇：Axios在Chrome上发送HTTPSXHR请求到端口80

下一篇：Axios在从WesayprintREST容器生成PDF时出现套接字挂起错误

Axios在纯js中可以GET请求，但在React中无法使用–CORS错误。

相关内容

热门资讯