iOS Web App:仅在应用程序是独立的时才显示内容

Question

如果用户访问我的网站示例,从Safari Mobile我怎么能在那里放置一个空白页面,上面写着"添加到主屏幕".添加后,它会显示不同的内容.

Answer 1

你想要检查两件事.首先,它是否在iOS设备上运行？第二,是window.navigator.standalone == true？

window.navigator.standalone主要由Webkit浏览器用于指示应用程序处于全屏(或独立)模式.大量设备(如运行Android的手机)支持此属性,但没有像iOS设备那样选择"添加到主屏幕",因此您需要同时检查两者.

演示:

使用Javascript:

function isIOS() {
    var userAgent = window.navigator.userAgent.toLowerCase();
    return /iphone|ipad|ipod/.test( userAgent );
};

function isStandalone() {
    return ( isIOS() && window.navigator.standalone );
};

window.onload = function () {
    if( isStandalone() || !isIOS() ) { //either ios+standalone or not ios
        //start app
    } else {
        //display add to homescreen page
    };
};