main.js
// 引入axios
import axios from 'axios'
// axios 配置
axios.defaults.timeout = 8000; //请求超时时间
axios.defaults.baseURL = 'http://applt.okyanan.com/api'; //自动拼接前面相同的部分
axios.token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiIiLCJhdWQiOiIiLCJpYXQiOjE1NzIwNjc4NzYsIm5iZiI6MTU3MjA2Nzg3NiwiZXhwIjoxNTcyMDc1MDc2LCJ1aWQiOjh9.lzAU52DoBsaaaINiPNHZVEC0GckAYPrLxxxsbRaxaSw'; //配置这个方便本地开发
// 下面的两行是本地开发使用
// headers:{token: localStorage.getItem('token') || axios.token}
// 后面这个axios.token写你封装的vue原型方法
// http request 拦截器
axios.interceptors.request.use(
config => {
console.log(axios.delete);
if (localStorage.getItem('token')) { //判断token是否存在
config.headers.token = localStorage.getItem('token') //将token设置成请求头
config.headers.common['token'] = localStorage.getItem('token') //两个都是好的选一个
}
return config;
},
err => {
return Promise.reject(err);
}
);
// http response 拦截器
axios.interceptors.response.use(
response => {
if (response.data.code === 3005 || 3001){ //后端返回的状态码
console.log("token过期");
}
return response;
},
error => {
return Promise.reject(error);
}
);
Vue.prototype.$http = axios;
页面中发请求(后端完全解决跨域之后,无需前端再配置代理,在本地也可以直接)(POST可以追加data)
methods: {
ok(){
this.$http({
method: 'GET',
url: 'index/index?street_id=' + 1 //POST可以写成data的形式
}).then(res=>{
console.log(res.data);
if(res.data.code === 10000){
localStorage.setItem('index', JSON.stringify(res.data.data));
console.log("登录成功app");
}else{
localStorage.clear('index');
this.$gettoken.gettoken()
}
}).catch(err=>{
console.log('街道信息请求错误!是:' + err);
})
}
},
mounted(){
this.ok();
}