微信小程序和網頁應用在跨平台運行時，常因系統版本和設備差異導致功能失效或界面錯亂，這帶來了很多負面的用户體驗，進而影響產品的口碑。

作為開發者，我們應該如何確保自己的應用能在各個平台中都能正確運行？

本文將為你係統梳理常見的設備兼容問題，並提供一套行之有效的解決方案。

小程序 platform 適配

在微信小程序中，platform 是系統信息（systemInfo）中的一個重要字段，用於表示當前運行環境的平台類型。開發者通常利用這一字段來識別不同設備或系統，進行針對性適配，讓同一小程序在  Android、HarmonyOS Next、iOS 等不同平台上展現出符合各平台特性的用户體驗。

例如，根據不同平台調整 Tabbar 的 bottom 值，避免與系統導航欄產生衝突等。

• 在手機場景，完整的判斷邏輯應該包含 android、ohos 和 ios 這三種常見的手機設備。
• 在電腦場景，完整的判斷邏輯應該包含 windows、ohos_pc 和 mac 這三種常見的電腦設備。

如果開發者在代碼中未能正確適配 platform 字段，可能會在對應設備上出現白屏等嚴重問題，阻塞使用。

小程序platform適配導致的接口報錯示例

小程序platform適配導致的UI紊亂示例

建議開發時參考如下代碼進行 platform 適配。

首先在小程序 app.js 文件中寫入如下代碼，將設備信息存入全局變量：

後續在各個頁面使用時可直接引用 getApp() 的全局變量來做邏輯判斷，或 setData 用於頁面判斷：

使用了 platform 的開發者可以參考上述方法優化，確保自己開發的小程序在  Android、HarmonyOS Next、iOS 等不同操作系統上或設備上都能以預期的方式運行。

網頁應用UA適配

UA 的全稱是 User-Agent（用户代理標識），是瀏覽器或客户端在發送 HTTP 請求時，通過請求頭傳遞給服務器的一個標識字符串，用於描述客户端的信息。 

例如，在不同設備的微信中訪問網頁時對應的 UA 字符串：

iOS：

Mozilla/5.0 (iPhone; CPU iPhone OS 18_6_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148 MicroMessenger/8.0.65(0x1800412f) NetType/WIFI Language/zh_CN

Android：

Mozilla/5.0 (Linux; Android 12; Pixel 4 XL Build/SQ3A.220705.003.A1; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/142.0.7444.102 Mobile Safari/537.36 MMWEBID/4681 MicroMessenger/8.0.65.2941(0x28004141) WeChat/arm64 Weixin GPVersion/1 NetType/WIFI Language/zh_CN ABI/arm64

HarmonyOS Next：

Mozilla/5.0 (Phone; OpenHarmony 6.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36 ArkWeb/4.1.6.1 Mobile MicroMessenger/8.0.13.33(0xf3800d21) Weixin NetType/WIFI Language/zh_CN MMWEBID/7944 MMWEBSDK/202511100006 XWEB/1140363

HarmonyOS Next PC：

Mozilla/5.0 (PC; OpenHarmony 5.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36 ArkWeb/4.1.6.1 NetType/WIFI MicroMessenger/7.0.20.1781(0x6700143B) WindowsWechat(0x63090a13) UnifiedPCOHOSWechat(0xf2b4100d) XWEB/2532 Flue

Windows PC：

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36 NetType/WIFI MicroMessenger/7.0.20.1781(0x6700143B) WindowsWechat(0x63090a13) UnifiedPCWindowsWechat(0xf2541510) XWEB/17071 Flue

Mac PC：

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36 NetType/WIFI MicroMessenger/7.0.20.1781(0x6700143B) MacWechat/3.8.7(0x13080712) UnifiedPCMacWechat(0xf26412f0) XWEB/16816 Flue

微信客户端瀏覽器的 UA 字符串包含設備類型：iPhone/OpenHarmony/Android 信息，通過 UA 適配，開發者可以根據不同設備類型加載相應的資源文件，調整界面佈局或交互方式，從而提供最適合當前設備的用户體驗。

• 在手機場景，完整的判斷邏輯應該包含 isAndroid、isHarmony 和 isIOS 這三種常見的手機設備類型。
• 在電腦場景，完整的判斷邏輯應該包含 isWindows、isHarmonyPC 和 isMAC 這三種常見的電腦設備類型。

如果開發者在代碼中未能正確適配 UA 字段，可能會在部分設備上出現交互無響應、顯示錯誤頁面等嚴重問題。

例如下面 2 個例子，就是沒有包含 isHarmony 的處理邏輯，造成用户明明是在手機端使用，卻出現了 PC 版的頁面，提示"請在移動端訪問"的問題。

未正確 UA 適配導致手機端顯示 PC 頁面

未正確 UA 適配導致無法使用問題

建議開發時參考如下代碼進行 UA 適配：

使用時：

使用了 UA 的開發者可以參考上述方法優化，確保自己開發的小程序、網頁應用，在 Android、HarmonyOS Next、iOS 等不同操作系統上，以及手機、PC 等不同設備上都能以符合預期的方式運行。