评论

小程序自动判断/切换开发环境、正式环境的方案

开发环境和正式环境的接口地址是不一样的,同样的代码,不用修改任何代码,就能自动访问对应的接口地址。

前段时间我也碰到了这个问题:
https://developers.weixin.qq.com/community/develop/doc/0004cc6fe543405bb0882c1b156800

开发环境和正式环境的接口地址是不一样的,同样的代码,不用修改任何代码,就能自动访问对应的接口地址。

示例代码:

let host = '';
let NODE_ENV = 'pro';
if( NODE_ENV === 'pro' ){
	host = 'https://pro.qq.com';
}else{
	host = 'https://dev.qq.com';
}

一般情况下大家都会这么写,那么NODE_ENV只能手动修改,官方没有给出当前的环境变量,我们只能自己想办法了。

我的灵感来自于“构建npm”功能,当安装了插件并构建npm之后,点上传代码,“node_modules”文件夹是不会上传的。
后来我搜索了文档,project.config.json配置项中的packOptions.ignore字段,用以配置打包时对符合指定规则的文件或文件夹进行忽略,以跳过打包的过程,这些文件或文件夹将不会出现在预览或上传的结果内。

好了,方案来了,我们可以在根目录新建一个文件,local.txt,然后配置它打包时不上传。那么我们可以添加如下代码:

const fileManager = wx.getFileSystemManager();
try{
	fileManager.accessSync('/local.txt');
	NODE_ENV = 'dev';
}catch(e){}

这样就可以了,因为线上包中没有local.txt这个文件,那么NODE_ENV=‘pro’,本地有这个文件,NODE_ENV=‘dev’。

完整代码:

let host = '';
let NODE_ENV = 'pro';
const fileManager = wx.getFileSystemManager();
try{
	fileManager.accessSync('/local.txt');
	NODE_ENV = 'dev';
}catch(e){}
if( NODE_ENV === 'pro' ){
	host = 'https://pro.qq.com';
}else{
	host = 'https://dev.qq.com';
}

over

PS: 还有的同学需要区分PC和手机,这个也比较简单,使用:wx.getSystemInfoSync();获取系统信息,如果是PC端的开发者工具,则platform = “devtools”

最后一次编辑于  2019-12-02  
点赞 5
收藏
评论

10 个评论

  • 小程序技术专员-villainhr
    小程序技术专员-villainhr
    2019-12-02

    代码排版,用下面的包裹一下,会好看些。

    ```

    let index = "测试"

    ```

    2019-12-02
    赞同 3
    回复 3
    • 八霄虎࿐          ⁶⁶⁶
      八霄虎࿐ ⁶⁶⁶
      2019-12-02
      谢谢,加上了
      2019-12-02
      1
      回复
    • BinBin
      BinBin
      2021-02-27回复八霄虎࿐ ⁶⁶⁶
      packOptions.ignore会忽略预览,而且我写上去后,本地也检测不到文件,等于没用啊!!packOptions.ignore设置了,本地的FileSystemManager.accessSync(string path)一样检测不到,等于线下没有这个文件,线上也没有了!!!!!
      2021-02-27
      回复
    • 只杀不埋
      只杀不埋
      2021-04-16
      wx.getAccountInfoSync()区分开发板体验版线上版了解一下
      2021-04-16
      2
      回复
  • 只杀不埋
    只杀不埋
    2021-04-16

    wx.getAccountInfoSync()区分开发板体验版线上版了解一下

    2021-04-16
    赞同 2
    回复
  • 云趣-何泉水
    云趣-何泉水
    2020-05-24

    根目录下新建env.txt ,

    fileManager.accessSync('/env.txt')

    会报错

    ```

    Error: accessSync:fail no such file or directory, access "/env.txt"

        at Object.i [as accessSync] (VM466 WAService.js:11)

        at e.onLaunch (app.js? [sm]:11)

        at e.o (VM466 WAService.js:18)

        at new e (VM466 WAService.js:19)

        at Function.<anonymous> (VM466 WAService.js:19)

        at VM466 WAService.js:18

        at app.js? [sm]:7

        at require (VM466 WAService.js:19)

        at <anonymous>:1:1

        at doWhenAllScriptLoaded (appservice?t=1590283565541:1280)

    ```

    2020-05-24
    赞同 2
    回复 3
    • Czy.
      Czy.
      2020-05-25
      我也报错了,请问怎么写才能找到文件路径?
      2020-05-25
      回复
    • 哆啦咪
      哆啦咪
      2020-06-24
      试了好几个文件,都找不到路径。  这个方法的使用示例
      2020-06-24
      回复
    • 只杀不埋
      只杀不埋
      2021-04-16
      wx.getAccountInfoSync()区分开发板体验版线上版了解一下
      2021-04-16
      回复
  • small hao
    small hao
    2022-01-06

    虽然目前有其他解决方案,但楼主思路很好,学习了。

    2022-01-06
    赞同
    回复
  • 彭世瑜
    彭世瑜
    2021-07-12
    这样好像也可以,客户端访问host有值,本地开发的时候没有值
    
    let res = wx.getSystemInfoSync();
      if (res.host) {
        return 'product';
      } else {
        return 'develop';
      }
    
    2021-07-12
    赞同
    回复
  • 华仔
    华仔
    2020-09-24

    使用官方Api 完美解决: https://developers.weixin.qq.com/community/develop/article/doc/000aaecd1989c8fa070be68f651813

    2020-09-24
    赞同
    回复
  • 飞雨
    飞雨
    2020-08-31

    还是不完美,开发完成,要提测到测试,测试人员只能用体验版测,这些你这个api后端地址就改不了了,我看官方文档现在有环境变量了,但写得太简单,没看懂,string USER_DATA_PATH

    文件系统中的用户目录路径 (本地路径)

    2020-08-31
    赞同
    回复 1
    • 只杀不埋
      只杀不埋
      2021-04-16
      wx.getAccountInfoSync()区分开发板体验版线上版了解一下
      2021-04-16
      回复
  • Equicy
    Equicy
    2020-04-02

    秒啊

    2020-04-02
    赞同
    回复
  • 夏天
    夏天
    2020-03-04

    wx.getSystemInfo({

    success: function (res) {

    //开发环境

    if (res.platform == 'devtools') {

    current = 'dev'

    } else {

    //生产环境

    current = 'prod'

    }

    }

    })


    2020-03-04
    赞同
    回复 4
    • Monster 👻
      Monster 👻
      2020-03-26
      不合理,根据客户端平台来区分,会导致体验版访问到正式环境。
      2020-03-26
      4
      回复
    • 八霄虎࿐          ⁶⁶⁶
      八霄虎࿐ ⁶⁶⁶
      2020-04-03
      这个代码可以合并一下,看具体需求吧
      2020-04-03
      回复
    • 夏天
      夏天
      2020-04-04回复Monster 👻
      关键点给你提点一下已经不错了, 还这么多要求
      2020-04-04
      回复
    • 只杀不埋
      只杀不埋
      2021-04-16
      wx.getAccountInfoSync()区分开发板体验版线上版了解一下
      2021-04-16
      回复
  • muse
    muse
    2019-12-05

    上传和预览没没办法判断了吧

    2019-12-05
    赞同
    回复 2
    • 八霄虎࿐          ⁶⁶⁶
      八霄虎࿐ ⁶⁶⁶
      2019-12-05
      官方不给解决方案,我们自己只能做到这些,不知道其他人有没有补充方案
      2019-12-05
      回复
    • 只杀不埋
      只杀不埋
      2021-04-16回复八霄虎࿐ ⁶⁶⁶
      wx.getAccountInfoSync()区分开发板体验版线上版了解一下
      2021-04-16
      回复
登录 后发表内容