使用vue2+Axios遇到的一些坑

共计 578 个字符，预计需要花费 2 分钟才能阅读完成。

1. 向服务器请求两次的情况

（1）axios 的默认请求头是 Content-Type: application/json，使用这个请求头会出现向服务器请求两次的情况；（2）浏览器会首先使用 OPTIONS 方法发起一个预请求，判断接口是否能够正常通讯，如果不能就不会发送真正的请求过来，如果测试通讯正常，则开始真正的请求；
浏览器对后台说：我可以请求你吗？(~ˇ~)
后台说：阔以。(~▽~)~*
结果是：发送原有的 GET(POST) 请求
后台说：不阔以。(‵﹏′)
结果是：报错

（3）解决方法：设置 axios 的默认请求头 axios.defaults.headers[‘Content-Type’] = ‘application/x-www-form-urlencoded’（使用 qs 模块可以不设置，qs 模块会自己设置。）；（4）设置之后，后台不认这个数据格式，所以在传递的时候必须先把数据转换格式；
// step1. npm install qs
// step2. 在 main.js 中，引入 qs 模块
import qs from ‘qs’;
// 需要时调用 qs.stringify() 方法
this.$axios.post(‘api/login’, qs.stringify({
name: ‘xxx’,
password: ‘********’
}).then(res => {

}).catch(err => {

});