Vue项目:在项目某个文件中获取目标代理服务器地址
前端在实现点击按钮下载的需求时,无论是采用a标签还是window.open方法,都需要写上完整的文件下载路径(如:192.168.1.1:8000/files/down_excle),但是当我们后端更换网络或者项目上传云端后,这里的IP地址一定会发生变化,如果将地址写死,下载功能则会失败。最后进行路径拼接即可。...
·
在项目中当我们想要一个路径前半部分(代理服务器)是可变的,后半部分(文件路径)是固定的时候,可以采用字符串拼接的方法,前面设一个变量赋值,获取代理服务器的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
最后进行路径拼接即可
更多推荐
已为社区贡献3条内容
所有评论(0)