Question

我已经编写了这个小片段，以测试一个webapp是否在Chrome的webapp模式下运行。它现在有效，但我只有一个三星S4来测试它。它通过测量可用的屏幕尺寸与窗口内部尺寸来实现。问题是，我使用的偏移在其他设备上是否有所不同。我知道测试它有点麻烦，但我们将非常感激！

function detectWebApp() {
var ua          = navigator.userAgent.toLowerCase();
var isAndroid   = ua.indexOf("android") > -1;
var isIOS       = ua.match(/(ipad|iphone|ipod)/g);
var isChrome    = ua.indexOf("chrome") > -1;
var offset      = new Array();
var sh          = screen.availHeight;
var sw          = screen.availWidth;
var ih          = window.innerHeight;
var iw          = window.innerWidth;
var isWebApp    = false;
var debug       = false;

// for now only test for android and iOS, other mobile platforms may be included later
if(isAndroid || isIOS) {
    // yes we're on a mobile OS
    if(isIOS) {
        if(window.navigator.standalone)  isWebApp = true;
    } else {
        // it is not IOS
        if(isAndroid) {
            offset[0] = 0;      // <- not all android devices show status header
            offset[1] = 25; // <- is android status header
            offset[2] = 44; // <- is including error message ssl cert;
                                    // documentation says 25dp = status header
                                    // , up til now all devices show this in javascript as 25px.
                                    // todo check offset for other android devices
        } else {
            // for future use, if mobile platform other than iOS or android
            offset[0] = 0;
        }
        if(window.orientation==0) {
            for (var i = 0; i < offset.length; i++) {
                if(ih == (sh - offset[i])) {
                    if(debug) alert(window.orientation + ' ' + ih + '==' + sh + ' offset:' + offset[i]);
                    isWebApp = true;
                    break;
                }
            }
        } else {
            if(isAndroid && isChrome) {
                // chrome on android doesn't switch values of availHeight and availWidth on orientation landscape
                for (var i = 0; i < offset.length; i++) {
                    if(ih == (sh - offset[i])) {
                        if(debug) alert(window.orientation + ' ' + ih + '==' + sh + ' offset:' + offset[i]);
                        isWebApp = true;
                        break;
                    }
                }
            } else {
                for (var i = 0; i < offset.length; i++) {
                    if(ih == (sw - offset[i])) {
                        if(debug) alert(window.orientation + ' ' + ih + '==' + sw + ' offset:' + offset[i]);
                        isWebApp = true;
                        break;
                    }
                }
            }
        }
    }
}
return isWebApp;

}

Answer 1

我找到了完整的Android设备列表，http://www.emirweb.com/ScreenDeviceStatistics.php 大小为25dp或0dp（取决于设备）。到目前为止，我测试过的所有设备都将其转换为25px（在javascript中），视口内容=“width = device-width，initial-scale = 1，maximum-scale = 1，user-scalable = no”。< / p>

检测android上的webapp模式

1 个答案: