当前位置:首页 > 短网址资讯 > 正文内容

思路清奇:通过 JavaScript 获取移动设备的型号

www.ft12.com6年前 (2017-07-14)短网址资讯1823

我们一般在浏览器里识别用户的访问设备都是通过 User Agent 这个字段来获取的,但是通过它我们只能获取一个大概的信息,比如你用的是 Mac 还是 Windows,用的是 iPhone 还是 iPad。如果我想知道你用的是第几代 iPhone,这个方法就不行了,前段时间我正好有这个需求,识别移动客户端的具体型号(主要是 iOS 设备),于是思考了下这个问题的实现。

首先,我跟大家一样想到了 UA,不过事实证明这路走不通。就在我无聊一个一个摆弄浏览器的 API 时,突然一篇文章里的某段代码提醒了了我。这篇文章讲的是怎样通过 js 获取图形设备信息的,因为 HTML5 支持了 canvas,所以可以通过 API 获取图形设备的型号,比如显卡的型号。

(function () {
    var canvas = document.createElement('canvas'),
        gl = canvas.getContext('experimental-webgl'),
        debugInfo = gl.getExtension('WEBGL_debug_renderer_info');

    console.log(gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL));})();

运行这段代码就可以获取显卡的型号了,如果你在iOS的设备里运行,会获取到诸如 Apple A9 GPU 之类的信息。而我们知道每一代 iOS 设备的 GPU 型号都是不同的,比如 iPhone 6 是 A8,而 iPhone 6s 就是 A9。看到这里,你应该大概知道我的思路了,就是通过识别 GPU 的型号来辨别设备的型号。

不过这还有个小瑕疵,有些设备是同一代,也就是 GPU 型号完全相同,比如 iPhone 6s, iPhone 6s Plus, iPhone SE。它们用的都是 Apple A9 GPU,怎么区分开它们呢?你会发现它们最大的不同不就是分辨率不同吗?而通过 JavaScript 我们又可以方便地获取屏幕分辨率,这样把两个手段综合应用一下就可以获取设备的准确型号了。

这里有个示例网址,大家可以用手机访问
https://joyqi.github.io/mobile-device-js/example.html

我的代码都放在了 GitHub 上
https://github.com/joyqi/mobile-device-js

这次思考给了我一些解决问题的启发,我们在思考解决方案的时候从侧面入手说不定会有新的发现。就比如我们的这个代码,目前还无法识别同一代的 iPad Air 和 iPad mini,因为它们的 GPU 和分辨率均相同,但是延续这个思路其实是有很多解决方案的,比如大家可以研究下这两个设备的话筒和喇叭个数,而这个数量也是可以通过 JS 获取的 :P

FT12短网址也是通过这个方法,判断用户的设备,然后根据不同的设备展示不同的短网址页面,从而提高用户体验度

扫描二维码推送至手机访问。

版权声明:本文由短链接发布,如需转载请注明出处。

本文链接:https://www.ft12.com/article_287.html

分享给朋友:

相关文章

征信机构必须是独立第三方吗?

征信机构必须是独立第三方吗?

[FT12短网址 ] 个人征信一直是行业焦点,而国内现有机构的“独立第三方”备受争议。本文主要从3个方面来解读:①如何界定“独立第三方”?②非独立第三方征信机构的问题;③非独立第三方机构进入征信业的关键问题。 ...

记一次go程序优化实践,获得了3倍性能的提升以及学会了on-cpu/off-cpu火焰图的使用

记一次go程序优化实践,获得了3倍性能的提升以及学会了on-cpu/off-cpu火焰图的使用

先把结论列在前面:1.Golang的性能可以做到非常好,但是一些native包的性能很可能会拖后腿,比如regexp和encoding/json。如果在性能要求较高的场合使用,要根据实际情况做相应优化。2.on-cpu/off-cpu火焰图...

微博开源的Motan RPC最新进展:新增跨语言及服务治理支持

微博开源的Motan RPC最新进展:新增跨语言及服务治理支持

https://github.com/weibocom/motanMotan 是一个基于 Java 开发的高性能的轻量级 RPC 框架,Motan 提供了丰富的服务治理功能和优秀的扩展能力,可以方便的基于 Motan 进行二次开发。Mota...

一位宁波父亲写给考上北大儿子的信,有网友“看哭了!”

一位宁波父亲写给考上北大儿子的信,有网友“看哭了!”

一位宁波父亲写给考上北大儿子的信刷爆朋友圈,或许这是他一路优秀的秘诀……文|宁波晚报记者 梅子满  这两天,一封宁波父亲写给即将上北大儿子的信在微信朋友圈里传疯了!  这封言语朴实平淡的家书,感动了无数网友,有网友直呼:“看哭了!”  在这...

FT12短网址教你如何利用大数据算法定位网站性能瓶颈(BOSS)

FT12短网址教你如何利用大数据算法定位网站性能瓶颈(BOSS)

导读:架构师非常关注性能问题,上篇文章中我们介绍了京东的自动化压测体系 ForceBot,这篇文章来自 LinkedIn 的技术博客,介绍如何通过大数据算法来分析调用数据,自动定位性能瓶颈。本文由高可用架构翻译。背景我们 FT12短网址的核...

我作为程序员辣么穷的黑历史

我在十三、四岁的时候第一次真正进入编程这个领域。从十一岁开始我就一直对计算机非常感兴趣,但在十三岁之前并没有太多地涉足编程。那大约是五年前。我记得在中学玩过一个游戏:Runescape。很多时候游戏都会崩溃,并且会看到一个奇怪的包含外国文字...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。