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 => {
});