我们一般通过UserAgent字段在浏览器中识别用户的访问设备，但是通过它我们只能获取一个大概的信息，比如你是否是一个Mac或Windows、iPhone或iPad。如果我想知道你用的是哪一代的iPhone，这个方法是行不通的。前段时间刚好有这个需要识别移动客户端（主要是iOS设备）的具体型号，于是想到了这个问题的实现。首先和大家一样想到了UA，结果发现这条路走不通。就在我厌烦一个一个摆弄浏览器API的时候，一篇文章中的某段代码突然让我想起了。本文讲的是如何通过js获取图形设备信息，因为HTML5支持canvas，所以可以通过API获取图形设备的型号，比如显卡的型号。(function(){varcanvas=document.createElement('canvas'),gl=canvas.getContext('experimental-webgl'),debugInfo=gl.getExtension('WEBGL_debug_renderer_info');console.log(gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL));})();运行此代码以获取图形卡的型号。如果您在iOS设备上运行它，您将获得AppleA9GPU等信息。而且我们知道每一代iOS设备的GPU型号都不一样，比如iPhone6是A8，iPhone6s是A9。看到这里，你应该知道我的思路了，就是通过识别GPU的型号来识别设备的型号。但是，仍然存在一个小缺陷。有些设备是同一代的，也就是GPU型号完全一样，比如iPhone6s、iPhone6sPlus、iPhoneSE。它们都使用AppleA9GPU，如何区分它们？你会发现它们之间最大的区别不就是分辨率吗？并且通过JavaScript，我们可以很方便的获取屏幕分辨率，综合应用两种方法，就可以得到设备的准确型号。这里有一个示例网址，你可以用手机访问https://joyqi.github.io/mobil...我的代码都在GitHubhttps://github.com/joyqi/mobi...这次思考给了我一些解决问题的灵感。当我们思考解决方案时，可能会从侧面找到新的发现。比如我们的代码目前无法识别同代的iPadAir和iPadmini，因为他们的GPU和分辨率是一样的，但是其实有很多方案可以延续这个思路。比如你可以研究这两个设备的麦克风和扬声器的数量，而这个数量也可以通过JS:P获取
