表单没有 CORS 错误，但发出 axios 发布请求时出现 CORS 错误答案

【问题标题】：No CORS error with form but CORS error when making axios post request表单没有 CORS 错误，但发出 axios 发布请求时出现 CORS 错误
【发布时间】：2022-01-23 07:51:55
【问题描述】：

我试图将一些表单发布到后端并想要处理 axios 请求，但是我在 axios 中遇到了 cors 错误。如果我使用常规 <form> 发布请求，它会起作用。

这是我的发送异步函数

const formData = new FormData();
formData.append('access_token', '0bf6fe96-3510-4105-ac4c-2656f1f14579');
formData.append('access_token_ttl', '10000000000000000000000000');
const res = await axios.post('myurl', formData, {
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
  },
});

这是有效的形式

<form action="myurl" method="post" target="_blank">
      <input name="access_token" value="0bf6fe96-3510-4105-ac4c-2656f1f14579" type="hidden" />
      <input name="access_token_ttl" value="10000000000000000000000000" type="hidden" />
      <input type="submit" value="submit" />
</form>

问题：如何发出有效的 axios 请求？

附：这是error的截图

【问题讨论】：

您应该显示 CORS 错误。
axios 中的“myurl”是什么
@morganney 添加了错误截图
@Akhil 它是接受我的帖子请求的后端服务器
您需要配置您的服务器以发送 CORS 标头。假设您使用的是节点后端，您可以查看：npmjs.com/package/cors

标签： reactjs forms axios request cors

【解决方案1】：

你在使用 axios 时碰到了same origin policy，所以为了跨域读取文档、脚本等你需要使用CORS。

表单提交有效，因为跨域写入不受同源策略的约束。特别是，

通常允许跨域写入。示例是链接、重定向和表单提交。一些 HTTP 请求需要预检。

【讨论】：