客户端能否设置CORS？React中Axios如何配置Origin请求头？

你之前的代码没生效，核心问题是**Access-Control-Allow-Origin是服务器返回的响应头，不是前端要发送的请求头**，前端设置这个字段完全没用。API服务商让你配置的是请求头里的Origin字段，正确实现方式如下：

方法一：全局配置Axios #

如果项目中所有请求都需要带这个Origin，可以全局统一设置：

// 在项目的Axios配置文件或入口文件（如index.js）中配置
import axios from 'axios';

// 全局设置请求头的Origin
axios.defaults.headers.common['Origin'] = 'https://api-swap-rest.bingbon.pro';

// 后续发起请求会自动携带该Origin头
axios.get(`https://api-swap-rest.bingbon.pro/api/v1/market/getLatestFunding?symbol=BTC-USDT`)
  .then(data => console.log(data))
  .catch(err => console.log(err));

方法二：单个请求单独配置 #

如果只有特定请求需要这个Origin，直接在对应请求中配置：

axios.get(`https://api-swap-rest.bingbon.pro/api/v1/market/getLatestFunding?symbol=BTC-USDT`, {
  headers: {
    'Origin': 'https://api-swap-rest.bingbon.pro'
  }
})
.then(data => console.log(data))
.catch(err => console.log(err));

注意事项 #

• 部分浏览器可能限制前端手动设置Origin头，若全局配置无效，优先尝试单个请求配置的方式。
• 确保API服务商的服务器确实允许接收该Origin值，毕竟是他们建议的配置，若仍有问题可再次联系服务商核实。

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