PWA：如何以编程方式触发：“添加到主屏幕”？在iOS Safari上 [英] PWA: How to programmatically trigger : "Add to homescreen"? on iOS Safari

问题描述

我最近发布了一个服务器呈现的渐进式网络应用程序，到目前为止一切都很好。
但是，使用Chrome的Android会显示一个横幅来下载应用程序，这很棒，但它不适用于iOS。使用Safari，用户只需点击几下即可进入添加到主屏幕功能，这很糟糕。

I released a server rendered progressive web app recently and everything works great so far. However, Android using chrome shows a banner to download the app which is awesome, but it doesn't on iOS. Using Safari, a user needs a few clicks to get to the "Add to homescreen" feature which is bad.

所以我在这里，我对我的PWA感到满意，但我真的很想能够自己告诉用户这个应用程序可以添加到主屏幕。

So here I am, I'm satisfied with my PWA, but I would really love to be able to tell the user myself that this app can be added to homescreen.

据我所知，我看到 https://marvelapp.com/ 这样做可以将原型添加到主屏幕。

As far as I can remember, I saw https://marvelapp.com/ doing it to add a prototype to the homescreen.

推荐答案

iOS - Safari目前不支持Web应用安装横幅，例如在Android - Chrome中。

iOS - Safari currently don't support Web app install banner, like in Android - Chrome.

在Android中有无法以编程方式触发安装横幅同样，除了捕获beforeInstallPromot并使用它来显示横幅的情况。

There is no way to programatically trigger install banner in Android as well, except for the case when you catch the beforeInstallPromot and use that to show the banner.

在链接的答案中，您可以查看有关如何在应用横幅中显示的备用选项，以指导用户添加到主屏幕。 此处是相同的代码示例，这是iOS特定的（在#PROTIP 3下查看）。

In the linked answer, you can check on the alternate option on how to show in app banner to guide user to add to home screen. Here is some code example for the same, which is iOS specific(look under #PROTIP 3).

这篇关于PWA：如何以编程方式触发：“添加到主屏幕”？在iOS Safari上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！