当我们在做小程序的时候,嵌入的有H5页面,并且H5页面请求接口域名地址和小程序域名地址不一致时,可以参考
config.js文件
const devConfig = {
url: 'https://.............', //开发地址
};
const prodConfig = {
url: 'https://.............', //测试地址
};
const devConfigH5 = {
url: 'https://.............', //开发地址H5
};
const prodConfigH5 = {
url: 'https://.............', //测试地址H5
}
const config = {
development: devConfig,
production: prodConfig,
};
const VUE_APP = {
API: process.env.NODE_ENV === 'development' ? config.development.url : config.production.url,
H5API: process.env.NODE_ENV === 'development' ? devConfigH5.url : prodConfigH5.url,
};
export default VUE_APP;
request.js文件
//引入文件
import VUE_APP form "@/common/config.js"
//小程序环境变量
const VUE_APP_API = VUE_APP.API
//H5环境变量
const H5_VUE_APP_API = VUE_APP.H5API
//window 只有在浏览器中存在 所以window.location.host可以获取当前域名
let TYPEAPP = window ? window.location.host == "h5页面域名........" : false
//定义一个变量 在下面接口封装的时候使用
let API_URL = TYPEAPP ? H5_VUE_APP_API : VUE_APP_API
//接口封装
............