Vue之axios请求踩坑记

在我们使用Vue框架的时候，我们不免会遇到各种各样的问题，话不多说。我们直接扔出我们的问题

Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.

Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.

Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.

重要的错误报三遍，以至于还在搜索这个问题的能够看见这篇帖子

那么我们的请求代码如下

let obj = {
        user: '020551',
        id: 'bb7bb'
};
return axios.post('url',obj);

看到这个我心里咯噔一下，这不就是跨域问题么？网上一搜也大都是说跨域问题。

在这里我们不要给误导了，这个不是跨域问题，这只是axios的post请求参数格式出问题了

axios的post请求发送健值对，需要引用qs处理一下才可以发送

npm install --save qs    //装一个qs模块

import qs from 'qs';       //引用qs模块
let obj = {
        user: '020551',
        id: 'bb7bb'
};
//post 请求
return axios.post('url',qs.stringify(obj));    //这样就不会报错了 

//或者get请求
return axios.get('url',{obj:obj});     //不这么写就会报错preflight response.

到这里问题就基本已经解决了！希望能给还在奔波解决这个问题的来个警醒，同时也能为未踩这坑的来个预防

文章为原创，转载需注明