vue2封装axios接口代码
2023-04-07 06:40:18
|
来源:腾讯云
(资料图片)
@toc
在/utils新建request
import axios from "axios"import bus from "@/utils/bus"import {Message} from "element-ui"const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url // baseURL: "/api", // url = base url + request url timeout: 100000, // request timeout})service.interceptors.request.use( config => { let currentUser = JSON.parse(sessionStorage.getItem("UserInfo")) if (currentUser && currentUser.token) { config.headers["Authorization"] = "token " + currentUser.token } return config }, error => { console.log(error) return Promise.reject(error) })// response interceptorservice.interceptors.response.use( response => { return response }, error => { const res = error.response.data const status = error.response.status if (status >= 500) { Message.error("服务繁忙请稍后再试") } else if (status >= 400) { if (res.status === 401) { Message.warning("您的账号登录已失效, 请重新登录") bus.$emit("logout") } else { Message.error("未知错误") console.error(error) } } return Promise.resolve(error) })export default service
接口js页面中
// 卡片管理模块import request from "@/utils/request"// getexport function getList(params) { return request({ url: "/", method: "get", params })}// POSTexport function postList(data) { return request({ url: "/", method: "POST", responseType: "arraybuffer", data })}
vue页面
//引入import { getList, postList} from "@/api/comparison.js";//使用 getList().then((res) => { });