Axios POST 请求抱怨跨域，但 curl 请求工作正常

Posted 2023-02-27

【中文标题】Axios POST 请求抱怨跨域，但 curl 请求工作正常

【英文标题】：Axios POST request is complaining about cross origin, but curl request works fine

【发布时间】：2018-07-28 15:25:13

【问题描述】：

 let url = 'http://localhost:4001/api/v1/sessions/new';
      axios.post(url, data)
        .then(function(resp) 
          console.log('resp returned is ' + JSON.stringify(resp));
        );

我在 chrome 控制台中看到了这个错误”

无法加载http://localhost:4001/api/v1/sessions/new：响应 预检请求未通过访问控制检查：否 'Access-Control-Allow-Origin' 标头出现在请求的 资源。因此不允许使用原点“http://localhost:4044” 使用权。响应的 HTTP 状态代码为 405。

如果我只是尝试卷曲完全相同的 API 调用，它就可以正常工作：

curl -d "email=[e-mail]&password=hello123" -X POST http://localhost:4001/api/v1/sessions/new

"apiResponse":"success":true,"errors":[]

为什么它适用于 CURL 而不适用于 axios？

【参考方案1】：

任何不在浏览器中运行的东西都不关心CORS。如果您希望您的 Web 应用程序向您的服务器发出请求，请将 Access-Control-Allow-Origin 标头添加到您的服务器的响应中，其中最允许的值为 *：

Access-Control-Allow-Origin: *

【讨论】：

我的服务器正在响应 Access-Control-Allow-Origin:* 我的其他 API 调用工作正常，有没有办法调试 axios 看到的内容？

查看 devtools 中的网络选项卡。 Axios也默认发送json，而你的curl命令不发送json。

我在 chrome devtools 网络选项卡的请求中看到了访问控制：Access-Control-Allow-Origin:*

我没有办法告诉你服务器上发生了什么。您可以做的是在网络选项卡中，右键单击失败的请求之一，然后转到复制 -> 复制为 cURL。将其粘贴到您的终端并与正在运行的 cURL 命令进行比较。