在开发微信小程序的时候,需要配置:
本地开发环境 体验预览环境 审核版环境 生产环境
为了简化环境配置,我只区分了两个环境
本地开发环境 生产环境/ 体验预览环境 审核版环境 生产环境
参考文档
基础 /系统 /wx.getSystemInfoSync
环境区分原理: 使用wx.getSystemInfoSync() 的 host参数
host Object 当前小程序运行的宿主环境 2.12.3
将配置文件放入一个目录中, 目录结构如下
config/ ├── index.js # 入口文件 ├── env.js # 环境获取 ├── dev.js # 开发环境配置 └── pro.js # 生产环境配置
env.js
/** * env */ export function getEnv() { let res = wx.getSystemInfoSync(); // 客户端中host有值,本地开发的时候host为null if (res.host) { return 'pro'; } else { return 'dev'; } }
dev.js
/** * dev */ export default { BASE_URL: 'http://127.0.0.1:8000/api', };
pro.js
/** * pro */ export default { 'BASE_URL': 'https://www.demo.com/api' }
inde.js
/** * index */ import { getEnv } from './env.js'; import dev from './dev.js'; import pro from './pro.js'; const env = getEnv(); console.log('env', env); let config = pro; if (env == 'dev') { config = dev; } export default config;
其他方案
1、wx.getAccountInfoSync
参考文档:
原生小程序根据当前版本自动切换 开发版本、体验版本、正式版本
微信小程序官方文档:开放接口 /帐号信息 /wx.getAccountInfoSync
实现代码
// 自动根据版本切换接口请求地址 const { miniProgram: { envVersion } } = wx.getAccountInfoSync(); let url = ''; switch (envVersion) { case 'develop': url = `${defaultConfig.devUrl}${params.url}`; break; case 'trial': url = `${defaultConfig.devUrl}${params.url}`; break; case 'release': url = `${defaultConfig.prodUrl}${params.url}`; break; default: url = `${defaultConfig.baseUrl}${params.url}`; break; }
使用 wx.getAccountInfoSync 获取的环境,在开发、预览、生产都可以,不过在审核期间竟然没有生效,请求了’localhost’ 地址,审核人员看不到数据,导致审核不通过。
2、wx.getFileSystemManager
参考文档:
小程序自动判断/切换开发环境、正式环境的方案
文件 /FileSystemManager /FileSystemManager.accessSync
实现代码
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'; }