1、請求源地址配置config.base.js
export default { "baseURL": "http://abc.com", "loginURL": "http://abc.com", "uploadImg": "http://abc.com/image/upload", "batchImageUpload": "http://abc.com/product/batchImageUpload/", "sentry": { "DSN": "", "version": "v1.0.0" }}
2、請求封裝request.jsimport axios from "axios"import Cookies from "js-cookie"import config from "../../config/config.base"let instance = axios.create({ headers: {'content-type': 'application/json'}, headers: {'Authorization': Cookies.get("Authorization")}})instance.defaults.baseURL = config.baseURLinstance.defaults.withCredentials = true// 新增請求攔截器instance.interceptors.request.use(function (config) { // 在傳送請求之前做些什麼 config.headers.channelToken = Cookies.get('channelToken') return config}, function (error) { // 對請求錯誤做些什麼 return Promise.reject(error)})// 新增響應攔截器instance.interceptors.response.use(function (response) { // 對響應資料做點什麼 if (response.status == "200") { if (response.data.code == "1001") { const loginUrl = Cookies.get("sysUrl") Cookies.remove("userName", { domain: "abc.com" }) Cookies.remove("token", { domain: "abc.com" }) localStorage.clear() window.location.href = loginUrl } } return response.data}, function (error) { // 對響應錯誤做點什麼 console.log('--- 401 res error response ---') console.log(error.response) if(error && error.response && error.response.status == '401') { const loginUrl = Cookies.get("sysUrl") Cookies.remove("userName", { domain: "abc.com" }) Cookies.remove("token", { domain: "abc.com" }) localStorage.clear() window.location.href = loginUrl } return Promise.reject(error)})export default instance
3、axios請求統一歸類 api.jsimport axios from "./request"
<1>不需要傳參
// 獲取渠道列表export const getChannelList = () => { return axios({ url: "/classification/treeList/", method: "post", data: {} })}
<2>需要傳參
// 根據暱稱和平臺搜尋評論內容export const getSearchComment = (params) => { return axios({ url: "/searchComment/", method: "post", data: params })}
4、在相應的vue檔案中進行方法呼叫
<1>不需要傳參
import {getChannelList} from './api'// 獲取渠道列表 getChannelList().then((res) => { if(res.code == "201") { // console.log(res.body); this.query.channel = res.body } })
<2>需要傳參
getSearchComment() { //自定義的方法 let params = { fromPlatform: this.searchPlatform,// 平臺淶源 nickName: this.name,// 網名 pageSize: this.pagination.pageSize,// 每頁幾條資料 pageNum: this.pagination.pageNum,// 當前頁數 } // 根據暱稱和平臺搜尋評論內容 getSearchComment(params).then((res) => { if(res.code == "201"){ // console.log(res.body); this.tableData = res.body; this.pagination.totalCount = res.totalCount } }) // console.log(this.searchImgListDate) },
最新評論