vue - JS 判断客户端是苹果 iOS 还是安卓 Android（封装好的方法直接调用）二种解决方案

介绍

有时候我们的项目，可能需要判断用户处于苹果还是安卓手机上，这时候就需要判断了。

其实，通过浏览器的 navigator.userAgent API 判断就行，下面提供两种方法自行选择。

解决方案 1

如下代码所示：

let u = navigator.userAgent;
let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;   //判断是否是 android终端
let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);     //判断是否是 iOS终端
console.log('是否是Android：', isAndroid); //true,false
console.log('是否是iOS：', isIOS)

封装成方法，方便多处调用：

// 检查客户端
judgeClient() {
  let u = navigator.userAgent;
  let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;   //判断是否是 android终端
  let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);     //判断是否是 iOS终端
  console.log('是否是Android：' + isAndroid); //true,false
  console.log('是否是iOS：' + isIOS);
  if(isAndroid){
    return 'Android';
  }else if(isIOS){
    return 'IOS';
  }else{
    return 'PC';
  }
},

解决方案 2

与前面的类似，但是写法不同：

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
  console.log('isIOS');
} else if (/(Android)/i.test(navigator.userAgent)) {
  console.log('isAndroid');
} else {
  console.log('isPC');
}

封装成方法：

// 检查客户端
judgeClient() {
  let client = '';
  if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {  //判断iPhone|iPad|iPod|iOS
    client = 'iOS';
  } else if (/(Android)/i.test(navigator.userAgent)) {  //判断Android
    client = 'Android';
  } else {
    client = 'PC';
  }
  return client;
},

写在后面

其实两种方案都差不多，看你自己的选择了，哪个更适合。