1.第一步
在public文件夾下新建一個(gè)config.js文件,并添加如下內(nèi)容
exports.PLATFROM_CONFIG = {
? ? baseURL: "服務(wù)器地址"
}
2.第二步
在vue.config.js中根據(jù)路徑引入后衡未,修改服務(wù)器代理地址target
const PLATFROM_CONFIG = require('./public/config.js')
devServer: {
? ? port: 8080,
? ? proxy: {
? ? ? '/fdapis': {
? ? ? ? target: PLATFROM_CONFIG.PLATFROM_CONFIG.baseURL,//修改服務(wù)器代理地址
? ? ? ? ws: false,
? ? ? ? changeOrigin: true,
? ? ? ? pathRewrite: {
? ? ? ? ? '^/fdapis': ''? //需要rewrite的,
? ? ? ? }
? ? ? }
? ? }
? },
3.第三步
在封裝的網(wǎng)絡(luò)請(qǐng)求文件中設(shè)置默認(rèn)請(qǐng)求地址,我的項(xiàng)目中請(qǐng)求地址在request.js文件中配置
首先碍遍,根據(jù)路徑引入public文件中的config.js文件:
import PLATFROM_CONFIG from '../../public/config'
其次蛤育,根據(jù)地址配置趁俊,修改PLATFROM_CONFIG文件中的baseURL地址:
PLATFROM_CONFIG.PLATFROM_CONFIG.baseURL=localStorage.getItem('BASE_URL')? // 在request.js中修改配置地址
這里之所以從localStorage.getItem('BASE_URL') 中取值,并賦值給PLATFROM_CONFIG文件中的baseURL是由于压储,我的地址在登錄時(shí)由用戶自己配置服務(wù)器地址以及端口號(hào)忘古,并存儲(chǔ)在了session中。如下圖所示:
最后疾渴,可以統(tǒng)一配置服務(wù)器請(qǐng)求地址:
Vue.prototype.BASE_URL = localStorage.getItem('BASE_URL') // 公共的服務(wù)器地址