时间戳

首页 > 解决方案 > 如何将 chrome 从 web 应用程序带到前台

javascript - 如何将 chrome 从 web 应用程序带到前台

问题描述

当网站内部发生某些事情时，是否有任何windows apps/google chrome flags/google chrome extension/javascript methods或任何其他事情可以将 chrome 窗口从背景（最小化）带到前台。我确实可以访问客户端计算机，如果可能的话，我可以设置 chrome 标志/信息亭模式或任何会阻止它打开到前台的东西。

例如，当订单进入时，我试图通过通知将窗口置于前台（我正在使用 firebase 消息）。我试图在其中做，window.open()但在控制台中出现错误提示setBackgroundMessageHandler()service workerwindow is not defined

如果 chrome 没有任何可用的东西来实现这一点，创建一个具有适当权限的Microsoft Progressive Web App是否允许我将该窗口从最小化状态带到前台？

标签： javascriptgoogle-chromeprogressive-web-appsminimizebackground-foreground

解决方案

我通过在服务工作者文件中添加它来解决它：

   self.addEventListener('push', function (e) {
        if (e.data) {
            var payloadData = e.data.json();
            self.clients.matchAll({includeUncontrolled: true}).then(function (clients) {
                clients[0].postMessage(payloadData); // you can do foreach but I only needed one client to open one window
            });
        }
    });

这在 main.js 文件中：

function openNotificationWindow(url) {
    var myWindow = window.open(url);   // Opens a new window
    myWindow.focus();
    myWindow.location.reload(true);
}

navigator.serviceWorker.addEventListener('message', function (event) {
    if (typeof event.data.data !== 'undefined') {
        openNotificationWindow(url);
    }
});

现在，每当我在前台或后台的窗口中发送通知时，push事件都会在 serviceworker 中触发，然后postMessage()用于与您可以访问windowDOM 组件的某个 main.js 文件进行通信。

推荐阅读