import axios from 'axios' // 引入axios
import { Message } from 'element-ui'
import router from '../router/index'
const axios2 = axios.create({
baseURL: '', // 请求的根路径
})
axios2.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
// 在每次发送请求前判断,如果请求的url不是登录接口,那么每次发起请求的时候可以带上token
if (config.url !== '/api/login') {
config.headers.Authorization = localStorage.getItem('token')
}
return config
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error)
})
axios2.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response.data
}, function (error) {
// 如果后台的状态响应码为401 给个提示,清除本地token 让他强制返回登录页
if (error.response && error.response.status === 401) {
Message({ type: 'danger', message: '用户身份已经过期,请重新登录' }) // 抛出提示框
setTimeout(() => {
router.push('/login') // 让路由强制跳转到登录页
}, 1000) // 一秒后跳转
}
return Promise.reject(error)
})
export default ({ url, method = 'get', params = {}, data = {}, headers = {},transformRequest }) => {
return axios2({
url: url,
method: method,
params: params,
data: data,
headers: headers,
transformRequest
})
}
示例
export const loginApi = data => request({
url: '/api/login',
method: 'POST',
data
})
今天在对接口的时候发现后端所需要的数据格式是formdata格式的 ,而默认传过去是 json格式的,看完官方文档后,封装还需要改一下
formData 对象传参示例
export const addStudentApi = (data) => request({
url: `/student/add`,
method: 'POST',
data,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
transformRequest: [function (data) {
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}]
})
新增下载封装
export default ({ url, method = 'get', params = {}, data = {}, headers = {}, transformRequest, responseType }) => {
return axios2({
url: url,
method: method,
params: params,
data: data,
headers: headers,
transformRequest,
responseType
})
}
使用示例
// 导出用户列表
export const exportUserListApi = () => request({
url: '/system/user/excel',
method: 'post',
responseType: 'blob'
})
// 导出
async handleExport () {
const res = await exportUserListApi()
// 将二进制文件转化为可访问的url
const url = window.URL.createObjectURL(res)
// 创建一个a链接
const a = document.createElement('a')
// 将a标签插入到body
document.body.appendChild(a)
a.href = url
a.download = '用户列表.xls'
a.click()
window.URL.revokeObjectURL(url)
}