axios添加了header头信息后发送的get请求自动变成option请求了，为什么？？？

Question

axios添加了header信息后发送的get请求自动编程option请求了，为什么？？？
原来是

axios.get(`http://***/api/v1/public/homepage`, {params: params})

加上header后

axios.get(`http://***/api/v1/public/homepage`, {params: params,headers:{"sn":"201021622343"}})

但是请求从get变成了options
之前：

之后：

Answer 1

options叫通讯员
通讯员跑到对方问可不可以派人来送信息了，回答不行，就中断！
回答可以，就排post兵前来送货！

不废话了：http://www.ruanyifeng.com/blo...

我记得sf前几天还推送过，你肯定没注意看

Answer 2

如果你是跨域请求，服务端返回响应时需要添加headers: Access-Control-Allow-Origin: *

express:

    // Website you wish to allow to connect
    res.setHeader('Access-Control-Allow-Origin', '*');
    // Request methods you wish to allow
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    // Request headers you wish to allow
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
    // Set to true if you need the website to include cookies in the requests sent
    // to the API (e.g. in case you use sessions)
    res.setHeader('Access-Control-Allow-Credentials', true);

Answer 3

这应当是跨域问题。浏览器自动在跨域的 GET 请求发送之前发送一个 OPTIONS 请求，以判断服务端是否允许这一域访问。可查看 axios 的 CORS 相关文档。

Answer 4

options 是去问是否支持 sn 这个 header，因此服务器端除了要跨域头之外还要允许的 header 头吧

Answer 5

以上是axios官网的原话

你可以用URLSearchParams来处理请求参数

var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);

但是这玩意兼容性超级超级差。

或者用qs这个库来解决

var qs = require('qs');
axios.post('/foo', qs.stringify({ 'bar': 123 }));

于是乎最终就用qs这个库了

Answer 6

您好，我也遇到了这个问题，请问您是怎么解决的呢