本文最后更新于 1078 天前，其中的信息可能已经有所发展或是发生改变。
一般判断访客客户端信息都是通过对User Agent 字段读取识别来进行，但是一方面这个是能伪造，另外一方面这里面也没有显卡信息，正好查资料发现HTML5 支持 canvas，所以可以通过 JS 获取图形设备的型号，比如GPU的型号，而目前基本上所有浏览器都已经支持HTML5，因此这个功能得以实现：
(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));
})();运行这段代码就能获取到设备的GPU信息，包括PC和手机都可以。
演示：
我也将我的设备信息在线查看网站进行了测试，是可以正确读取的：设备信息在线查看
下面是完整实例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> New Document </title>
</head>
<body>
<script id=clientEventHandlersJS language=javascript>
(function () {
var canvas, gl, glRenderer;
function getCanvas() {
if (canvas == null) {
canvas = document.createElement('canvas');
}
return canvas;
}
function getGl() {
if (gl == null) {
gl = getCanvas().getContext('experimental-webgl');
}
return gl;
}
function getGlRenderer() {
if (glRenderer == null) {
debugInfo = getGl().getExtension('WEBGL_debug_renderer_info');
glRenderer = debugInfo == null ? 'unknown' : getGl().getParameter(debugInfo.UNMASKED_RENDERER_WEBGL);
}
return glRenderer;
}
if (window.MobileDevice == undefined) {
window.MobileDevice = {};
}
window.MobileDevice.getGlRenderer = getGlRenderer;
})();
</script>
<h1>GPU: <script>document.write(MobileDevice.getGlRenderer());</script></h1>
</body>
</html>
