zoukankan      html  css  js  c++  java
  • 前端通过js获取手机型号

    前段通过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获取具体机型
  • 相关阅读:
    tree
    gridview XML
    http://jingyan.baidu.com/article/22a299b513f3db9e18376a5e.html
    tree btn
    sss rar jar
    ComponentOne Studio
    http://wpf_sl.cnblogs.com/ WPF/Silverlight深蓝团队
    ddddd
    [牛客每日一题] (前缀和+线性 DP) NC15553 数学考试
    [停更一周,我干了什么] [C++/QT] 一个基于avl树,trie树,哈希散列表的英汉词典
  • 原文地址:https://www.cnblogs.com/alisleepy/p/11200325.html
Copyright © 2011-2022 走看看