0

我目前正在 Vaadin14 开发 PWA。我目前的目标是在浏览器中显示安装窗口，但我根本无法得到它。

我尝试使用https://vaadin.com/pwa/learn/installing-applications作为指南。我有一个有效的证书并在浏览器中为应用程序使用 HTTPS 连接。使用了以下@PWA注解：

@Route("main") 
@PWA(name = "Test", shortName = "Test", backgroundColor = "#227aef", themeColor = "#227aef") 
public class MainView extends AppLayout implements RouterLayout, BeforeEnterObserver {

我用 Chrome 和 Firefox 试过，都没有显示安装窗口。

提到 Vaadin 自己创建了一个 Web App Manifest 和 ServiceWorker ( https://vaadin.com/docs/v14/flow/pwa/tutorial-pwa-pwa-with-flow.html )

Vaadin 服务器自动提供 Web 清单、服务工作者、图标、离线页面和安装提示，并将必要的添加添加到应用程序标头中。

但是，在我的项目构建后，我无法在任何地方找到这些文件。它们存储在哪里？

我在这里想念什么？

编辑：Firefox 具有以下配置，我将其设置为true.

如果在 about:config 中将 dom.serviceWorkers.enable 首选项设置为 false，则服务工作者可能不可用。

Edit2：我可以验证 Firefox 没有为我的应用程序启动 Service-Worker。

4

2 回答 2

0

为了在移动设备上显示 A2HS（添加到主屏幕）对话框，您应该正确配置一个正在运行的 service worker 和一个 web manifest 文件。

在桌面浏览器的情况下，您不会看到弹出窗口（除非 vaadin 自己为您打开一个窗口，但我没有这种技术），而是在浏览器地址栏中看到一个 (+) 图标（这里是 Chrome）：

在此处输入图像描述

您应该首先确定是否正确生成了 service worker 和 web manifest。也许它们在 /bin 文件夹中，在项目结构中有点隐藏。

于 2019-09-27T10:24:26.503 回答
0

我终于能够解决这个问题。肯定花了一些时间。问题是我的自定义 VaadinServlet 无法识别我的 @PWA 注释，因此我必须手动添加它。

public class VaadinFlowServlet extends com.vaadin.flow.server.VaadinServlet {

@Override
public void init(ServletConfig servletConfig) throws ServletException {
    var registry = 
    ApplicationRouteRegistry.getInstance(servletConfig.getServletContext());
    registry.setPwaConfigurationClass(LoginView.class); // <-- contains @PWA

    super.init(servletConfig);
}
于 2019-10-14T05:27:10.517 回答