Vue项目:在项目某个文件中获取目标代理服务器地址

在项目中当我们想要一个路径前半部分(代理服务器)是可变的,后半部分(文件路径)是固定的时候,可以采用字符串拼接的方法,前面设一个变量赋值,获取代理服务器的target地址,这样在以后换代理IP后也不用更改路径。

使用场景举例:

前端在实现点击按钮下载的需求时,无论是采用a标签还是window.open方法,都需要写上完整的文件下载路径(如:192.168.1.1:8000/files/down_excle),但是当我们后端更换网络或者项目上传云端后,这里的IP地址一定会发生变化,如果将地址写死,下载功能则会失败。

错误写法:

download () {
     const a = document.createElement('a')
      a.href = 'http://192.168.1.1:8000/file/download_excel'
      a.download = 'filename.xsl' 
      a.click()
}

拼接路径写法:

download () {
    var path='/Mergereport/download_excel';
    window.open(API_CONFIG.devServer.proxy['/has'].target+path,"target")
    }

获取代理地址方法:

//引入Vue.config.js文件
import  API_CONFIG from "../../../vue.config.js"
//在使用的地方获取代理地址
var ippath=API_CONFIG.devServer.proxy['/has'].target

最后进行路径拼接即可

猜你喜欢

转载自blog.csdn.net/qq_46103732/article/details/126369134