vue封裝axios自動帶上token

在我們使用vue開發的時候，請求後台我們通常使用axios這些第三方庫來實現，但是我們在使用的時候，遇到乙個問題，我們每乙個請求都需要帶上token,這樣就增加了我們的重複工作量。

所以，我們可以對axios做乙個封裝，讓我們使用它的時候，自動帶入token和url的字首（url的字首生產環境和開發環境可以不同）

好了，直接上**：

import axios from 'axios'

import vue from 'vue';
import qs from 'qs';
//import store from '@/store';
import from 'element-ui';
import router from '@/router/index.js';
//import store from '@/store'
const service = axios.create()
// request interceptor
service.interceptors.request.use(
config => 
else if(config.isfile&&config.isfile===true)
else
} let token = sessionstorage.getitem("token");
if (token&&token!=='') 
return config
},error => 
)// response interceptor
service.interceptors.response.use(res => else if (code !== 1) )
return promise.reject(res.data)
} else 
},error => )
return promise.reject(error)})
export default service

//json的上傳格式：

request(,
isobj:true
}).then(res => );
//form表單的上傳格式：
request(
}).then(res => );

在.env.development中定義：

在.env.production中定義：

假如需要走**，可以在.env.development這樣定義

再在vue.config.js裡定義**

devserver: }},

disablehostcheck: true
},

vue專案封裝axios

還是直奔主題吧，因為官方不推薦使用vue resource，而是推薦axios，所以這篇文章分享給大家我在自己的專案裡如何封裝axios，雖說將axios在main.js裡寫入vue的原型鏈作為vue的屬性 vue.prototype.http axios 直接用最原始的方法也能進行請求 這樣也不是...

vue簡單封裝axios

1 在src下新建api資料夾，在api資料夾下新建config.js檔案 2 config.js配置如下 import axios from axios import qs from qs mint ui 框架，若不需要請全部注釋掉 import from mint ui axios.defaul...

vue 封裝axios請求

最近接手新的vue專案，發現axios竟然沒有封裝，立馬動手封裝，這裡記錄一下完整的封裝過程，廢話不說，直接上 baseconfig.js檔案 存放各個伺服器的位址 const express require express const proenv require pro.env 生產環境配置檔案...