iOS Web App：仅在应用程序独立时显示内容 [英] iOS Web App: Showing content only if the application is standalone

问题描述

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

If a user visits my websites example, from Safari Mobile how could I place there a blank page that says "Add To Homescreen."? Once added it would show different content.

推荐答案

您需要检查两件事。首先，它是在iOS设备上运行的吗？第二，是<$​​ c $ c> window.navigator.standalone == true ？

You'll want to check two things. First, is it running on an iOS device? Second, is window.navigator.standalone == true?

window.navigator。独立的主要由Webkit浏览器用于指示应用程序处于全屏（或独立）模式。很多设备（如运行Android的手机）都支持这个属性，但没有像iOS设备那样选择添加到主屏幕，所以你需要检查两者。

window.navigator.standalone is primarily used by Webkit browsers to indicate the app is in fullscreen (or standalone) mode. Plenty of devices (like phones running Android), support this property, but don't have the option to 'Add to Homescreen' like iOS devices do, so you need to check both.

演示：

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

这篇关于iOS Web App：仅在应用程序独立时显示内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！