快捷搜索:

如何修改Vue打包后文件的接口地址配置的方法

如何修改Vue打包后文件的接口地址配置的方法

  动态网页asp编程软件有哪些功能做相应的配置即可。但是最近在做的项目中,涉及到私有化部署,就是对应的生产环境的地址,不是唯一的。如果每次都修改一个地址,再打包文件进行部署,过程繁琐且低效。那么如何把环境地址设置成可配置的,不需要再构建代码就能直接生效呢?

  1)在static上设置一个config.js,把配置的参数设置成window下的全局变量。这种方案的确可行,但是,但是,不安全ASP编程!!! 如果请求地址被恶意修改,后果不太好~

  2)使用generate-asset-webpack-plugin插件,配置一大坨后生成一个静态文件,然后通过请求的方式,获取需要的数据,这种方法可以解决安全性问题,但是,但是,有点小麻烦啊~

  第二步:在main.js中请求定义的配置文件,并放到Vue.prototype中,使全局可访问,注意,这里把new Vue()放在请求里执行,是防止请求与页面渲染之间的时间差异化导致值获取不到,因此这样比较保险。

  执行npm run build可以看到打包文件夹static文件夹下的config.json,之后可以修改配置,刷新页面即可。

  因为请求和打包操作的时差性,哪怕它是请求本地的文件,但是有时发现它的请求会比我们系统的第一个请求慢了,这个时候就会失效。

  解决方法:相信我们的项目中都对请求进行了一些封装操作,只要将对应的baseURL的值改成实时获取Vue.prototype.BASE_URL的值,就可以保证接口请求能够准确获取到了~

  到此这篇关于如何修改Vue打包后文件的接口地址配置的方法的文章就介绍到这了,更多相关Vue打包后接口地址配置内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能还会对下面的文章感兴趣: