Javascript Firebase Web JS，在后台接收通知，然后在您的网页中进行处理

我正在处理firebase云消息

场景： 当我的浏览器在后台时，我通过Service Worker收到通知，它会在浏览器处理程序中显示通知，如下所示

现在，如果我单击通知或打开浏览器，我将无法在网页中获取该通知的详细信息

我想要什么

我想当用户点击通知或打开浏览器时，它应该通过我网页上的TOASTR JS之类的库触发通知，这样用户就可以与它交互，转到所需的通知页面或我想在这里做的任何事情

服务人员文件

importScripts（'https://www.gstatic.com/firebasejs/7.22.0/firebase-app.js');
进口文件（'https://www.gstatic.com/firebasejs/7.22.0/firebase-messaging.js');
//初始化Firebase
var firebaseConfig={
apiKey：“AIzaSyBvOpTvMo_vxMi1l3EEcd8UbbQPeW2Ktdg”，
authDomain:“educore portal.firebaseapp.com”，
数据库URL:“https://educore-portal.firebaseio.com",
projectId:“教育核心门户”，
storageBucket:“educore portal.appspot.com”，
messagingSenderId：“1038865124281”，
appId:“1:1038865124281:web:26a7ae36c7819a170f8468”，
测量TID：“G-N8PGZHM0P5”
};
firebase.initializeApp（firebaseConfig）；
const messaging=firebase.messaging（）；
//如果要自定义在中接收的通知
//背景（Web应用程序已关闭或不在浏览器焦点中），然后您应该
//实现此可选方法。
//[启动后台处理程序]
messageing.setBackgroundMessageHandler（函数（有效负载）{
log（“[firebase messaging sw.js]接收到后台消息”，有效负载）；
//在此处自定义通知
const notificationTitle='背景消息标题'；
const notificationOptions={
正文：“背景消息正文”，
图标：'/firebase logo.png'
};
返回self.registration.showNotification（notificationTitle，
通知选项）；
});
//[结束背景\u处理程序]
messaging.onBackgroundMessage（（有效负载）=>{
log（'Message received.onBackgroundMessage'，有效载荷）；
});我试图搜索一种方法，在浏览器处于后台时收到通知时，在我的网页内触发该通知。但我没有找到任何与Firebase相关的解决方案

所以我想到的是使用
文档可见性更改事件侦听器

这是如何使用它的基本结构。
每次更改选项卡的可见性状态时，都将调用它。
因此，每当用户返回我的网页时，我都会调用函数来检查是否有新消息，如果发现，则触发其他函数以显示通知或刷新聊天消息等

希望它能帮助你们


document.addEventListener（“visibilitychange”，function（））{
console.log（document.visibilityState）；
//运行代码段并切换选项卡/浏览器，然后再次返回
//隐藏的
//可见的
});能否请您提供有问题的代码，而不是代码文件的图像，这将有帮助。当然我会编辑问题@Manojthanks，为我工作，参考链接：