React/Typescript项目使用Axios发跨域POST请求，常规方案处理仍报CORS错误

问题根因梳理 #

• CORS规则由被请求的目标服务端控制：你前端直接请求第三方API时，CORS权限是第三方API的服务端决定的，你自己的Node/Express后端配置CORS完全不生效，前端请求头加Access-Control-Allow-*这类响应头字段也属于无效操作，反而可能导致预检请求被第三方拦截。
• 403错误分两种场景：如果是OPTIONS预检请求返回403，本质还是跨域权限问题，第三方API未对你的前端域名开放跨域访问；如果是实际POST请求返回403，大概率是你的请求参数、鉴权信息或者格式不符合第三方要求。

可行解决方案 #

1. 清理无效前端配置
   删除请求头里所有Access-Control-Allow-*字段、crossDomain参数，这类配置对解决跨域没有任何作用。
2. 走后端代理转发绕开跨域
   不要让前端直接请求第三方API，改为前端先请求你自己的Express后端接口，再由后端服务向第三方API发起请求：服务端之间的 HTTP 请求不存在CORS限制，从根本上解决跨域问题。
3. 修正请求参数格式
   你当前代码存在参数和格式不匹配的问题：
   • 如果第三方要求Content-Type: application/x-www-form-urlencoded，请求体不能直接传JS对象，需要用qs.stringify(jsonData)转为表单格式再传递
   • 如果第三方要求Content-Type: application/json，把Content-Type改成对应值，直接传对象即可
4. 排查403错误
   走后端代理后如果还是返回403，打印转发请求的全量参数、鉴权头、请求体，和第三方API文档要求逐一比对：重点检查Authorization的Bearer Token是否有效、请求字段是否缺失、参数名拼写是否正确。

关于API提供方的问题说明 #

如果第三方API明确要求只能通过前端直接发起请求，你可以让对方把你的前端域名添加到他们的CORS白名单中，否则跨域问题你单方面无法解决。

内容的提问来源于stack exchange，提问作者kresnik