vue项目如何通过前端实现自动识别并配置服务器环境地址
前言: 一般来说,一个web项目的生产环境和测试环境的服务器地址一旦确定下来,很少会频繁变动的。那么就可以单独写一个脚本文件,通过当前访问的域名来判断当前的访问环境,然后再通过一定的规则获取对应的服务器地址。如此一来,只要设计好服务器地址适配文件,那么只需要打一次包,就可以自动区分不同的服务器环境了。你不用再为每次打包上传不同环境都要手动改服务器地址而烦恼,也不会再出现忘了改配置文件而连接到错误的服务器上。 解决方案: 配置所有环境服务器地址变量——获取当前访问域名——根据域名判断是否包含在服务器地址变量中,如果有则使用该服务器地址,否则使用默认配置地址。 示例代码: //1.定义所有环境服务器地址 const server={ pro:"https://pro.xxx.com/api/",//生产环境 dev:"http://dev.xxx.com/api/",//测试环境 util:"http://util.xxx.com/api/"//其他环境,可以为空,为空则适配到测试环境 } //2.获取当前访问域名,并根据域名判断当前环境,然后获取指定环境的服务器地址 var DOMIN="";//服务端接口访问跟路径 const origin=location.hostname//当前访问域名 for(var i in server){ var item=server[i] if