iOS 16.5的PWA是否支持Web Push API？排查推送无通知问题

iOS 16.4及以上版本的PWA（安装到主屏幕的渐进式Web应用）是支持Web Push API的，但Safari浏览器的普通网页模式不支持，这和你测试的结果完全一致。

你能获取推送Token、调用推送接口得到message_id，说明基础流程已经走通，但收不到通知大概率是遗漏了以下关键流程或设置：

1. 必须在Service Worker中处理push事件 #

iOS不会自动展示推送消息，必须在Service Worker中监听push事件并主动调用showNotification()，否则即使推送到达设备也不会弹出通知。示例代码：

self.addEventListener('push', (event) => {
  // 解析推送数据，兼容标准Web Push和APNs格式
  const payload = event.data?.json() || {};
  const notificationOptions = {
    body: payload.body || payload.aps?.alert?.body || '新通知',
    title: payload.title || payload.aps?.alert?.title || '通知',
    icon: '/icons/icon-192x192.png', // 必须提供符合iOS尺寸要求的图标
    badge: '/icons/badge-72x72.png'
  };

  // 必须用waitUntil保证通知展示完成前Service Worker不被销毁
  event.waitUntil(
    self.registration.showNotification(notificationOptions.title, notificationOptions)
  );
});

同时要通过Safari开发者工具的「Service Workers」面板，确认你的Service Worker已成功注册且处于活跃状态。

2. 推送Payload必须兼容APNs格式 #

iOS的Web Push依赖Apple的APNs服务，因此推送请求的Payload必须包含aps字段（APNs标准字段），仅使用Web Push的标准格式会导致iOS无法解析。示例合法Payload：

{
  "aps": {
    "alert": {
      "title": "订单提醒",
      "body": "您的订单已发货"
    },
    "sound": "default"
  },
  "customData": "自定义业务数据"
}

3. PWA Manifest配置需满足要求 #

确保manifest.json包含以下必填字段，否则iOS不会将其识别为合格的PWA：

• name/short_name：不能为空
• icons：至少提供192x192和512x512尺寸的PNG图标
• display：必须设置为standalone或fullscreen（不能是browser模式）
• scope：正确设置应用作用域，保证Service Worker注册路径在该范围内

4. 系统级通知权限与状态检查 #

• 确认PWA已安装到主屏幕（iOS要求只有安装后的PWA才能使用Web Push）
• 检查iOS系统设置：进入「设置→通知→你的PWA应用」，确认已开启通知权限，且允许横幅/声音提醒
• 关闭设备的「专注模式」或「请勿打扰」，这类模式会屏蔽所有通知

内容的提问来源于stack exchange，提问作者Chhorn Soro