專案中碰到這樣一個需求點，在h5頁面區分當前所處客戶端環境是QQ客戶端、微信客戶端還是QQ瀏覽器客戶端，並做不同的邏輯處理

首先可以通過 window.navigator.userAgent 獲取到當前頁面瀏覽器核心資訊

經過一系列踩坑之後總結髮現三者的核心資訊區別

// 微信 ：      MicroMessenger    MQQBrowser    　　　　　　　　　　　　　　　　　　　　　　　NetType

// QQ  ：                        MQQBrowser(注：ios中無此資訊，替換為QBWebView)    　　　　NetType

// QQ瀏覽器：                     MQQBrowser

由此可見只有微信的webview中有可明顯區分的資訊（MicroMessenger）

function env() {

    let userAgent = window.navigator.userAgent;

    let inWeChat  = userAgent.indexOf('MicroMessenger');

    let androidBrowser= userAgent.indexOf('MQQBrowser');

    let iosBrowser= userAgent.indexOf('QBWebView');

    let netType= userAgent.indexOf('netType');

    if (inWeChat > -1) {

        // 微信有單獨標識先判斷微信

        return 'weChat'

    }

    if (netType > -1 && (androidBrowser > -1 || iosBrowser > -1)) {

        // QQ中有nettype資訊

        return 'QQ'

    }

    if (androidBrowser > -1 || iosBrowser > -1) {

        // 最後再判斷QQ瀏覽器

        return 'QQBrowser'

    }

    return '';

}

上面方法即可區分出當前webview在QQ、微信還是QQ瀏覽器

要注意的一點就是安卓和ios中的QQ客戶端的webview核心資訊有點區別，上面有註明