用JavaScript检测iPad版本

Question

是否可以在Web应用程序中检查iPad版本(1或2)？由于用户代理看起来相同(请参阅http://www.webtrends.com/Support/KnowledgeBase/SolutionDetail.aspx?Id=50140000000acbiAAA),因此浏览器的标准检查在此处不起作用.

我们可以检查JavaScript中仅在版本2中可用的功能(如陀螺仪)吗？

Answer 1

请试试这个小提琴.它通过陀螺仪可用性检测iPad的版本.

正如您在Safari Developer Library中看到的那样,event.acceleration在具有陀螺仪的设备上不为空.由于iPad 1没有它,我们可以假设这个设备是iPad 1.

为了区分iPad 2和iPad 3,我们可以查看window.devicePixelRatio房产,因为iPad 3的Retina显示屏的像素比率== 2.

Answer 2

抱歉,目前iPad和iPad 2没有区别.

看,两者之间没有区别:

iPad:
?Mozilla/5.0 (iPad; U; CPU OS 4_3 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8F190 Safari/6533.18.5

iPad2:
?Mozilla/5.0 (iPad; U; CPU OS 4_3 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8F191 Safari/6533.18.5

请注意,那里的版本在iOS更新中不断变化.

UPDATE

貌似是它们之间的区别:

iPad:
  Mobile/8F190

iPad 2:
  Mobile/8F191

iPad 3:
  Mobile/9B176 (according to Philipp)

Answer 3

有点晚了，但是通过使用WEBGL_debug_renderer_info扩展（它是WebGL API的一部分），您可以检索GPU的供应商和渲染器名称。

将其与设备的屏幕尺寸相结合，您可以准确定义设备的版本。

// iPad model checks.
function getiPadModel(){
    // Create a canvas element which can be used to retreive information about the GPU.
    var canvas = document.createElement("canvas");
    if (canvas) {
        var context = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
        if (context) {
            var info = context.getExtension("WEBGL_debug_renderer_info");
            if (info) {
                var renderer = context.getParameter(info.UNMASKED_RENDERER_WEBGL);
            }
        }
    }    

if(window.screen.height / window.screen.width == 1024 / 768) {
    // iPad, iPad 2, iPad Mini
    if (window.devicePixelRatio == 1) {
        switch(renderer) {
            default:
                return "iPad, iPad 2, iPad Mini";
            case "PowerVR SGX 535":
                return "iPad"
            case "PowerVR SGX 543":
                return "iPad 2 or Mini";
        }
    // iPad 3, 4, 5, Mini 2, Mini 3, Mini 4, Air, Air 2
    } else {
        switch(renderer) {
            default:
                return "iPad 3, 4, 5, Mini 2, Mini 3, Mini 4, Air, Air 2";
            case "PowerVR SGX 543":
                return "iPad 3";
            case "PowerVR SGX 554":
                return "iPad 4";
            case "Apple A7 GPU":
                return "iPad Air, Mini 2, Mini 3";
            case "Apple A8X GPU":
                return "iPad Air 2";
            case "Apple A8 GPU":
                return "iPad Mini 4";
            case "Apple A9 GPU":
                return "iPad 5, Pro 9.7";
        }
    }
// iPad Pro 10.5
} else if (window.screen.height / window.screen.width == 1112 / 834) {
    return "iPad Pro 10.5";
// iPad Pro 12.9, Pro 12.9 (2nd Gen)
} else if (window.screen.height / window.screen.width == 1366/ 1024) {
    switch(renderer) {
        default:
            return "iPad Pro 12.9, Pro 12.9 (2nd Gen)";
        case "Apple A10X GPU":
            return "iPad Pro 12.9 (2nd Gen)";
        case "Apple A9 GPU":
            return "iPad Pro 12.9";
    }
} else {
    return "Not an iPad";
}
}

也可以针对iPhone型号完成此操作，此博客将介绍更多细节。