评论

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

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

前段时间我也碰到了这个问题:
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
收藏
评论

7 个评论

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

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

    ```

    let index = "测试"

    ```

    2019-12-02
    赞同 3
    回复 1
  • 某某
    某某
    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)

    ```

    05-24
    赞同 2
    回复 2
    • A꯭ll B꯭lu꯭e
      A꯭ll B꯭lu꯭e
      05-25
      我也报错了,请问怎么写才能找到文件路径?
      05-25
      回复
    • 哆啦咪
      哆啦咪
      06-24
      试了好几个文件,都找不到路径。  这个方法的使用示例
      06-24
      回复
  • 华仔
    华仔
    09-24

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

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

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

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

    08-31
    赞同
    回复
  • Equicy
    Equicy
    04-02

    秒啊

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

    wx.getSystemInfo({

    success: function (res) {

    //开发环境

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

    current = 'dev'

    } else {

    //生产环境

    current = 'prod'

    }

    }

    })


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

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

    2019-12-05
    赞同
    回复 1
    • 八霄虎࿐          ⁶⁶⁶
      八霄虎࿐ ⁶⁶⁶
      2019-12-05
      官方不给解决方案,我们自己只能做到这些,不知道其他人有没有补充方案
      2019-12-05
      回复
登录 后发表内容