记录在Vue项目中轻松封装axios的操作
目录结构
安装axios安装axios
NPM安装axios
request.js 该文件中对axios进行封装
importaxiosfrom ' axios ' const base URL=' http://创建localhost 33604000/API '//axios实例constservice=axios.create (ururate 添加axios请求拦截器service.interceptors.request.use (config={ if (local storage.getitities ) ) gintoken ) ) } return config} )的批量设置，error={ return promise.reject (error )//axios响应拦截器service.interceptors error={ //console.log (看(，error.response ) const ) status )=error.responseif ) status====401 )/tokokokon tokenlocalstorage.removeitem ) (logintoken ) (router.push ) (/) (returnpromise.reject ) () ) )
根据当前环境而定，不同的生产/开发/测试环境(url ) base URL : process.env.node _ env==' production '？ ' productApi': 'developApi '批量请求标头配置headers : { get : } ' content-type ' : ' application/x-www-form-' 还需要单点登录和其他功能的通用请求标头，可以批量放置}，post : { ' content-type ' 3360 ' application/JSON； charset=utf-8' //开发通常还需要单点登录和其他功能的通用请求标头，可以批量放置}、跨域和响应代码处理
是否允许域间属性—— with credentials 3360 true/false
在响应请求并将请求发送到序列化//服务器之前，序列化请求数据transform request : [ function (data ) data=JSON.stringify ) data //传递给then的响应数据transform response : [ function (data ) if ] type of data==' string ' data.starts with ] data=JSON
API.js import { axios } from './request ' constapi={ user 3360 '/user/getusers ' } exportdefaultapiexportfunctiongetiongetetttttettttti method: 'post '，data: param，//headers: )/(content-type ' : charset=utf-8 '//}，//time out :
使用
参考资料
33559 www.cn blogs.com/Qian xiaox/p/14025708.html