添加requireInteraction:true后Web推送通知仍自动消失，如何解决？

针对你在Blazing Pizza项目中遇到的requireInteraction: true参数在Windows 10/11的Edge浏览器中不生效（通知20秒后自动消失），但Chrome正常的问题，可尝试以下解决方案：

• 检查Edge的系统通知超时设置
  Windows系统的通知设置可能会覆盖浏览器的requireInteraction配置。打开系统「设置」→「系统」→「通知」，找到Microsoft Edge并点击进入，将「通知超时」选项设置为「从不」。Edge会继承系统对通知的超时规则，即使代码里声明了需要用户交互，系统级的超时设置依然会生效。

• 添加renotify: true参数配合使用
  在showNotification的配置中补充renotify: true参数，部分浏览器环境下，该参数可以强化requireInteraction的持久化效果，避免通知被自动关闭。修改后的代码如下：

  self.addEventListener('push', event => {
      const payload = event.data.json();
      event.waitUntil(
          self.registration.showNotification('Blazing Pizza', {
              body: payload.message,
              icon: 'img/icon-512.png',
              vibrate: [100, 50, 100],
              requireInteraction: true,
              renotify: true, // 新增参数
              data: { url: payload.url }
          })
      );
  });
  

• 确保推送消息的高优先级
  低优先级的推送消息可能会被浏览器或系统自动缩短显示时长。发送推送请求时，在请求头中添加Urgency: high（或对应推送服务的高优先级配置），让系统优先处理这条通知，确保其持续显示直到用户交互。

• 排查Edge版本与扩展干扰
  确认使用的是最新稳定版Edge浏览器，旧版本可能存在requireInteraction的兼容性问题。同时禁用广告拦截、隐私类扩展，这类扩展可能会修改通知的默认行为，导致参数失效。

内容的提问来源于stack exchange，提问作者Martin Andersen