Meta标签“apple-mobile-web-app-capable”适用于Android吗？

Question

有没有一种像iPhone一样创建Android Web应用的方法？

可以在HTML页面的元素中使用“apple-mobile-web-app-capable”元标记，向苹果iOS表明该应用程序可以安装到用户的主屏幕上，因此它会启动Safari Mobile浏览器而不带菜单栏。

- Zymotik

---

具有讽刺意味的是，苹果已经放弃了对PWA的明确支持，而Chrome/Android已经将其提升到了一个新的水平。2021年后十年间，PWA的情况如何发展？ - Ravinder Payal

Answer 1

Chrome在Android上现已支持一个meta标签mobile-web-app-capable：

自Chrome M31以来，您可以设置您的Web应用程序，使设备的主屏幕上添加一个应用程序快捷方式图标，并使用Chrome for Android的“添加到主屏幕”菜单项在全屏“应用程序模式”下启动应用程序。

关于mobile-web-app-capable meta标签的详细信息，请向下滚动到“M39之前支持主屏幕安装的应用程序”：

自M31以来，Chrome将查找网页元素中的以下meta标签（如果有指定显示的清单，则会忽略此标签）：

<meta name =“mobile-web-app-capable”content =“yes”>

名称属性必须为“mobile-web-app-capable”，内容属性必须为“yes”（不区分大小写）。如果内容属性中存在任何其他值，则将Web应用程序添加为常规书签。

尽管我没有运行Chrome M31的任何设备进行测试，但我理解这意味着只要使用了那个mobile-web-app-capable meta标签，就可以支持具有在设备主屏幕上的图标的全屏Web应用程序，其支持的版本可追溯到Chrome M31。

- Josh

---

我知道这是一个旧问题，但当我来到这里寻找答案时，它是我第一个搜索的结果。我继续搜索并在其他地方找到了答案（http://www.html5rocks.com/en/mobile/fullscreen/），我认为作为一名好的互联网公民，我的职责是回到这里，确保下一个搜索者能够在这里找到答案。 - Josh

同样的 Josh。2019年。 - Lucas Vazquez

Answer 2

自Chrome31+版本起，在Android平台上也支持主屏幕Web应用程序。详情请见此处。

- Ludis studio

Answer 3

我不这么认为。

然而，检测浏览器是否为Android设备并显示指向Android市场应用程序（或直接指向APK）的链接是相当简单的。

由于Android拥有WebView小部件，因此编写一个加载专用网站的应用程序或以某种方式包装离线内容（在首次启动时下载或在资产文件夹中提供）非常容易。

- Phil Lello

---

这种方法的缺点是被绑定到一个生态系统中，并且可能有一个过时的应用程序。网络开发已经够让人头疼了。不过还是谢谢。 - Zymotik

Answer 4

使用jQuery，您可以查看内容的高度是否大于视口高度。如果不是，则可以将其设置为该高度。

$(document).ready(function() { 
  if (navigator.userAgent.match(/Android/i)) { 
    window.scrollTo(0,0); // reset in case prev not scrolled   
    var nPageH = $(document).height(); 
    var nViewH = window.outerHeight; 
    if (nViewH > nPageH) { 
      nViewH -= 250; 
      $('BODY').css('height',nViewH + 'px'); 
    } 
    window.scrollTo(0,1); 
  } 

}); 

感谢meagar：从浏览器中删除地址栏（以在Android上查看）

- Zymotik

Answer 5

您可以在主屏幕上创建书签的快捷方式（=任何网页）。

- molnarm

---

是的，您可以在主屏幕上创建一个快捷方式，但它只是一个书签。在iPhone/iOS上，“书签”（WebApp）具有特殊功能，如无菜单栏打开、加载图像和自定义图标。它还加载到Safari的隔离副本中，因此如果浏览器受到限制锁定，Web应用程序仍将加载。这在Android上是否可行？ - Zymotik