微信小程序不同环境下如何动态切换后端请求地址

花子占爷丶

已于 2022-06-13 14:55:46 修改

阅读量1.5k

点赞数 1

分类专栏：微信小程序 js 文章标签：微信小程序小程序

于 2022-06-13 14:53:49 首次发布

本文链接：https://blog.csdn.net/wzsud/article/details/125259634

版权

js 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

微信小程序

3 篇文章 0 订阅

订阅专栏

本文介绍了如何在微信小程序中根据不同环境（开发、测试、线上）动态切换后端请求地址。通过获取`__wxConfig.envVersion`判断当前环境，并在`app.js`中设置全局变量`globalData`来存储对应环境的API地址。在页面中，可以通过`getApp().globalData`访问这些地址，实现请求的动态切换。

摘要由CSDN通过智能技术生成

微信小程序不同环境下如何动态切换后端请求地址

经过打印 __wxConfig.envVersion 可以得出以下结论

开发	体验版（测试）	线上
develop	trial	release

那么我们写一个switch 语句就可以动态切换了

//app.js
App({
  onLaunch: function (cb) {
  	console.log(__wxConfig);
    const version = __wxConfig.envVersion;
    switch (version) {
      // 开发
       case 'develop':
             this.globalData.host= 'https://dev.hzzy.xyz',
             this.globalData.apihost= 'https://dev.hzzy.xyz/api'
       break;
       // 测试
       case 'trial':
             this.globalData.host= 'https://uat.hzzy.xyz',
             this.globalData.apihost= 'https://uat.hzzy.xyz/api'
       break;
       // 线上
       case 'release':
           this.globalData.host= 'https://hzzy.xyz',
           this.globalData.apihost= 'https://hzzy.xyz/api'
       break;
       default:
            this.globalData.host= 'https://dev.hzzy.xyz',
            this.globalData.apihost= 'https://dev.hzzy.xyz/api'
        break;
    }
    
  globalData: {
    userInfo: null,
    host: '',
    apihost: ''
  }
})

使用

// pages中引入全局变量
var app = getApp()
wx.request({
	 url: app.globalData.apihost + 'test',
	 method: 'POST',
	 data: {},
	 header: {
	   'content-type': 'application/json'
	 },
	 success: function (res) {}
})