iOS 网络应用程序 : Showing content only if the application is standalone

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
    };
};