摘要：在UniApp跨平台开发中，精准判断运行环境是实现多端差异化的关键。本文将介绍6种判断平台的实用方法，涵盖编译时与运行时场景，助你轻松处理多端兼容问题。
一、为什么需要判断平台？
在UniApp跨平台开发中，不同平台（微信小程序、H5、Android/iOS App）存在API差异、样式兼容等问题。通过平台判断可实现：
- 执行平台专属API
- 加载不同样式文件
- 实现差异化业务逻辑
- 条件编译优化包体积
二、6种平台判断方法详解
方法1：uni.getSystemInfoSync（推荐）
最佳场景：运行时动态判断
const systemInfo = uni.getSystemInfoSync();// 判断平台
if (systemInfo.platform === 'android') {console.log('Android设备');
} else if (systemInfo.platform === 'ios') {console.log('iOS设备');
}// 判断环境
switch(systemInfo.uniPlatform) {case 'mp-weixin': // 微信小程序逻辑break;case 'h5':// H5逻辑break;case 'app': // App逻辑break;
}
返回值说明：
platform: 设备平台（android/ios/其他）uniPlatform: 运行环境（mp-weixin/h5/app等）
方法2：条件编译（编译时判断）
最佳场景：平台专属代码编译
// #ifdef H5
console.log('当前是H5环境');
// #endif// #ifdef MP-WEIXIN
console.log('微信小程序环境');
// #endif// #ifdef APP
console.log('App环境');
// #endif
平台标识大全：
- H5
- MP-WEIXIN
- MP-ALIPAY
- APP
- MP-BAIDU
- MP-TOUTIAO
方法3：process.env.UNI_PLATFORM
最佳场景：Webpack配置/复杂逻辑判断
const platform = process.env.UNI_PLATFORM;// 输出示例：'h5'/'mp-weixin'/'app'
console.log('当前平台：', platform);
方法4：通过User Agent判断（H5专用）
最佳场景：H5端细分浏览器环境
const ua = navigator.userAgent.toLowerCase();if (ua.match(/micromessenger/i)) {console.log('微信浏览器');
} else if (ua.match(/alipay/i)) {console.log('支付宝环境');
}
方法5：uni-app扩展库判断
import { isWechat, isAlipay } from 'uni-platform'if (isWechat) {console.log('微信环境');
}
方法6：环境变量组合判断
// 判断iOS App
const isIOSApp = uni.getSystemInfoSync().platform === 'ios' && process.env.UNI_PLATFORM === 'app';
三、各方法对比表
| 方法 | 执行时机 | 适用场景 | 优点 | 缺点 |
|---|---|---|---|---|
| 条件编译 | 编译时 | 平台差异较大时 | 代码纯净，无运行时开销 | 需重新编译 |
| getSystemInfoSync | 运行时 | 动态判断 | 精准识别设备 | 增加运行时计算 |
| process.env | 编译时/运行时 | 配置差异化构建 | 灵活组合判断 | 需熟悉构建配置 |
四、最佳实践建议
- 优先使用条件编译处理平台差异较大的功能
- 运行时判断配合try-catch处理API兼容
- H5端注意使用特征检测代替UA判断
- 小程序分包时通过process.env动态配置资源路径
常见问题：
Q：如何区分Android/iOS App？
A：使用uni.getSystemInfoSync().platform获取
Q：微信小程序内如何判断iOS/Android？
A：systemInfo.system.indexOf('iOS') > -1
