vue设置动态请求地址的例子 - 行业资讯 - 肥雀云

在开发和生产环境下,请求不同的地址(http或ws),使其置入线上环境,无论是什么域名都不用手动更改请求地址

<>强思路:使前端请求接口地址简单化

上代码:在vuex中设置总的接口地址,然后在生产和开发环境下配置不同的地址

　　　　　　出口const configUrl={ 　　url: process.env.API_HOST, 　　ws: process.env.API_WS 　　} 　　　　

然后在配置文件夹中,设置dev.env.js和prod.env.js

　　　　　　模块。出口=合并(prodEnv, { 　　NODE_ENV:“发展”, 　　API_HOST:“urlProxy/,//开发环境下的代理地址　　API_WS:“ws://192.168.0.57:8081/api/websocket”” 　　}) 　　　　

prod.env.js:

　　　　　　使用严格的　　模块。出口={ 　　NODE_ENV:“生产”, 　　API_HOST:“/api/,//生产环境下的接口,如:www.baidu.com/api/API_WS:““/api/websocket”//wss://www.baidu.com/api/websocket 　　} 　　　　

<强> wss的地址配置不同,需要做一个单独处理:

　　　　　　(这让url=新的url。url, window.location.href) 　　url。=url.protocol协议。替换(“https”、“wss) 　　　　

替换一下就好了

以上这篇vue设置动态请求地址的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。