PWA:preventDefault不能与preventDefault一起使用

Bra*_*rth 9 javascript progressive-web-apps

我正在Android设备上的Chrome 70上进行测试,这完全可以防止AddToHomescreen提示出现。我不能阻止提示或捕获以供以后使用。该提示将继续显示在每个页面加载中。

文本框已填充,并显示正在加载beforeinstallprompt事件。事件处理程序上的preventDefault不会阻止提示。

为什么??????

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="theme-color" content="#eaa103">
    <link rel="manifest" href="/pwa/manifest.json" />
    <title>Some App</title>
    <link rel="stylesheet" href="/pwa/css/bootstrap.min.css" />
    </head>
    <body>

    <div class="container">
        <testbox></testbox>
    </div>

    <script src="/pwa/js/jquery.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">

    </script>

    <script>
    var deferredPrompt;
    window.addEventListener('beforeinstallprompt', function(e) {
        // Prevent Chrome 67 and earlier from automatically showing the prompt
        e.preventDefault();
        // Stash the event so it can be triggered later.
        deferredPrompt = e;
        $("testbox").html("beforeinstallprompt loaded");
        return false;
    }); 
    </script>

    </body>
    </html>
Run Code Online (Sandbox Code Playgroud)

man*_*and 1

根据谷歌开发者的这篇文章:https://developers.google.com/web/updates/2018/06/a2hs-updates

从 Chrome 68 开始,无论是否在事件preventDefault()中调用,都会显示迷你信息栏beforeinstallprompt

因此,目前开发人员无法在移动 Chrome 版本 > 67 上屏蔽页面上的横幅(它适用于桌面版和旧版移动版本 < 68)。

这里有更多信息:https ://developers.google.com/web/fundamentals/app-install-banners/ 。就像声明的那样:

迷你信息栏是 Android 版 Chrome 的临时体验

如果被用户拒绝,则只有经过足够的时间(约 3 个月)后才会显示。

我希望这有帮助。