Vue项目 vue.config.js配置 & request.js一次封装axios
vue.config,jsmodule.exports = {publicPath: './',lintOnSave: false,//每次保存代码的时候是否启动eslintdevServer: {host: '127.0.0.1',port: 8080,open: true,//项目启动时自动打开浏览器proxy: {'/api': {// '/api'时代理的标识,告诉node url前面的/
·
vue.config,js
module.exports = {
publicPath: './',
lintOnSave: false,//每次保存代码的时候是否启动eslint
devServer: {
host: '127.0.0.1',
port: 8080,
open: true,//项目启动时自动打开浏览器
proxy: {
'/api': {// '/api'是代理的标识 url前面的/api是使用代理的
target: 'http://testapi.....cn/',//接口地址
changeOrigin: true,//跨域
}
}
},
configureWebpack: {
plugins: [
],
},
};
common > api > request.js
import axios from 'axios'
import { MessageBox } from 'element-ui'
//默认请求头
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
//创建axios对象
const service = axios.create()
//请求拦截器
service.interceptors.request.use(req => {
req.headers['Cathe-Control'] = 'no-cache' //访问此页面时 不会在internet的临时页面中留下备份
return req
}, error => {//没拦截上
Promise.reject(error)
})
//响应拦截器
service.interceptors.response.use(res => {
//未设置状态码则默认成功状态
if (res.request.responseType == 'blob') {
return res.data
}
const code = res.data.meta.code
if (code === '50002') { //如果获取到错误信息
MessageBox.confirm('登录状态已过期,请重新登录', '系统提示', {
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
window.location.href = '/home'
}).catch((err) => {
console.log(err)
})
return Promise.reject('error')
} else {//如果没有错误信息
return res.data
}
}, error => {//没拦截上
return Promise.reject(error)
})
export default service;
common/api/webConfig.js
import request from './request'
export default {
//请求网站配置
webConfig() {
return request({
url: '/api/setting/get'
})
}
}
components>foot>Foot.vue
import request from './request'
export default {
//请求网站配置
webConfig() {
return request({
url: '/api/setting/get'
})
}
}
更多推荐
已为社区贡献5条内容
所有评论(0)