JavaScript-携帯電話におけるアクセスページの判断

3081 ワード

最近WeChatサービス番号の開発をしていますが、一つの問題はWeChatサービス番号で調べた個人のメッセージです.ブラウザをクリックして見れば(iOSではSafariで開けます)ログインページにジャンプするはずです.ページはバックグラウンドから取得する必要があるので、サービス側の判断が必要です.保存ページであれば、バックグラウンドデータが必要でないなら、フロントで判断できます.バックグラウンドはNodeJSなので、クライアントとサービス端末の2つのバージョンのコードを参照に提供します.
クライアント判定
方法は簡単で、userAgentによって判断して、先にモバイル端末かどうかを判断して、iOS端末とAndroid端末かを判断することができます.また、アプリケーションによって微信、微博、qqアクセスを判断することもできます.
var browser = {
    versions: function() {
        var u = navigator.userAgent,
           ua = navigator.userAgent.toLowerCase();
        return { //           
            trident: u.indexOf('Trident') > -1, //IE  
            presto: u.indexOf('Presto') > -1, //opera  
            webKit: u.indexOf('AppleWebKit') > -1, //  、    
            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //    
            mobile: !!u.match(/AppleWebKit.*Mobile.*/), //       
            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios  
            android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android   uc   
            iPhone: u.indexOf('iPhone') > -1, //   iPhone  QQHD   
            iPad: u.indexOf('iPad') > -1, //  iPad
            webApp: u.indexOf('Safari') == -1 ,//  web    ,       
            wechat:ua.match(/MicroMessenger/i) == "micromessenger",//  
            weibo:ua.match(/WeiBo/i) == "weibo",//  
            qq:ua.match(/QQ/i) == "qq"//qq
        };
    }(),
    language: (navigator.browserLanguage || navigator.language).toLowerCase()
};
console.log(navigator.userAgent);
実務上の判断
NodeJSも同様にuserAgentで判断します.コードは以下の通りです.
var browser= function(req) {
    var u = req.headers['user-agent'];
    var ua = u.toLowerCase();
    //           
    return {
        trident: u.indexOf('Trident') > -1, //IE  
        presto: u.indexOf('Presto') > -1, //opera  
        webKit: u.indexOf('AppleWebKit') > -1, //  、    
        gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //    
        mobile: !!u.match(/AppleWebKit.*Mobile.*/), //       
        ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios  
        android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android   uc   
        iPhone: u.indexOf('iPhone') > -1, //   iPhone  QQHD   
        iPad: u.indexOf('iPad') > -1, //  iPad
        webApp: u.indexOf('Safari') == -1, //  web    ,       
        wechat: ua.match(/MicroMessenger/i) == "micromessenger",//  
        weibo: ua.match(/WeiBo/i) == "weibo",//  
        qq: ua.match(/QQ/i) == "qq"//QQ  
    };
};

exports.browser=browser;
基本的な判断はありますが、判断の結果によっては違った応答が与えられます.