JS判断客户端是iOS还是Android

冯奎
2018-01-03 19:17:08
PHP
javascript

User Agent中文名为用户代理，
简称 UA，它是一个特殊字符串头，
使得服务器能够识别客户使用的操作系统，
以及版本、CPU 类型、浏览器及版本、浏览器渲染引擎、浏览器语言、浏览器插件等。
这样我们可以通过判断浏览器的userAgent，
用正则来判断手机是否是ios（苹果）和Android（安卓）客户端。
代码如下：

<script type="text/javascript">
    var u = navigator.userAgent;
    console.log(u);
    if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) {
        alert("Android");
    }else if(!!u.match(/\(i\[^;\]+;( U;)? CPU.+Mac OS X/)){
        alert("IOS");
    }else{
        alert("WEB");
    };
</script>

下面一个比较全面的浏览器检查函数，提供更多的检查内容，
你可以检查是否是移动端（Mobile）、ipad、iphone、微信、QQ等。
第一种：来自http://blog.baiwand.com/?post=176

<script type="text/javascript">
    //检测浏览器语言
    currentLang = navigator.language;   //判断除IE外其他浏览器使用语言
    if(!currentLang){//判断IE浏览器使用语言
        currentLang = navigator.browserLanguage;
    }
    alert(currentLang);
    //判断访问终端
    var browser={
        versions:function(){
            var u = navigator.userAgent, app = navigator.appVersion;
            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应该程序，没有头部与底部
            };
        }(),
        language:(navigator.browserLanguage || navigator.language).toLowerCase()
    }
    //browser.versions.trident返回真假，真则是IE内核，以此类推browser.versions.webKit是否为谷歌内核
    //判断是否IE内核
    if(browser.versions.trident){
        alert("is IE");
    }
    //判断是否webKit内核
    if(browser.versions.webKit){
        alert("is webKit");
    }
    //判断是否移动端
    if(browser.versions.mobile||browser.versions.android||browser.versions.ios){
        alert("移动端");
    }
</script>

第二种：来自http://www.fufuok.com/js-iphone-android.html

<script type="text/javascript">
    if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
        //alert(navigator.userAgent);
        window.location.href ="iPhone.html";
    } else if (/(Android)/i.test(navigator.userAgent)) {
        //alert(navigator.userAgent);
        window.location.href ="Android.html";
    } else {
        window.location.href ="pc.html";
    };
</script>