前端通过js获取手机型号

时间：2024-04-15 08:48:20

前段通过js获取手机型号

需求：

用户登录后记录当前的手机型号并记录

插件：

  1. mobile-detect.js插件地址
  2. mobile-device-js插件地址

使用步骤：

  • 获取UA信息->根据安卓和IOS不同的处理
  • IOS再通过插件mobile-device-js去获取型号
  • 安卓通过解析UA信息去获取build之前的信息得到手机型号
//引入插件

<!--获取手机型号相关js-->

<script type="text/javascript" src="/mobile-detect.js"></script>

<!--配合这个js再去获取苹果手机的型号-->

<script type="text/javascript" src="/iphone-device.js"></script>

	//获取userAgent信息

	var user_agent = navigator.userAgent;

	console.log(user_agent);

	//初始化mobile-detect

	var md = new MobileDetect(user_agent);

	var os = md.os();//获取系统

	var newMobile = "";

	//ios系统的处理

	if(os == "iOS"){

		os = md.os() + md.version("iPhone");

		ios = md.mobile();

		//再通过iphone-device.js获取具体的苹果手机型号

		newMobile = MobileDevice.getModels().join(' or ');

		if(newMobile == 'unknown'){

			newMobile = '';

		}

	}

	//Android系统的处理

	else if(os == "AndroidOS"){

		os = md.os() + md.version("Android");

		var sss = user_agent.split(";");

		//判断UA里边有没有Build信息，通过这个拿到安卓的具体机型

		var i = sss.contains("Build/");

		if (i > -1) {

			newMobile = sss[i].substring(0, sss[i].indexOf("Build/"));

		}

	}

	//

	//判断数组中是否包含某字符串（安卓机型获取用到）

	Array.prototype.contains = function(needle) {

		for (i in this) {

			if (this[i].indexOf(needle) > 0)

				return i;

		}

		return -1;

	}

	//写入数据库

	if(newMobile){

		$.get(

			'/saveUserMobile.php',{uid:uid, mobile:newMobile},

			function(json){

				console.log(json.msg);

			},'json'

		);

	}

总结

  • 通过mobile-detect.js插件获取UA信息
  • 安卓系统里通过Build/前一个信息拿到安卓的机型
  • IOS系统里在通过另一个插件mobile-device-js获取具体机型

相关文章