
- HTTPS 网站:网页推送只能在具有有效 SSL 证书的安全网站上运行
- Service worker:您必须能够将 OneSignal Service Worker 添加到您的网站
- 单一域名来源:必须遵循同源策略
- 用户权限:用户必须明确授权才能接收通知
- 支持的浏览器:适用于大多数现代浏览器(Chrome、Firefox、Safari、Edge)
网页推送开发者指南
在您可以发送网页推送通知之前,您的开发人员需要完成以下步骤。不是开发人员?请参阅管理团队成员以邀请具有开发者访问权限的团队成员加入您的 OneSignal 项目。
Web SDK 设置
安装和配置 OneSignal Web SDK 的完整指南,包括本地测试和权限提示。
WordPress 插件
使用我们的官方插件在 WordPress 上快速集成推送通知——无需编码。
iOS 网页推送设置
按照 Apple 的具体步骤在运行 iOS 16.4+ 的 iPhone 和 iPad 上启用网页推送。
从其他提供商迁移
了解如何从其他网页推送提供商迁移并保留您的订阅者。
配置选项
在 OneSignal 仪表板的 设置 > 推送和应用内 > Web 中为您的网站设置网页推送。

常规网站
推荐 - 直接在仪表板中配置提示、欢迎通知和服务工作者设置——无需后端编码。
WordPress
使用官方 OneSignal 插件,通过完全基于 UI 的配置轻松在您的 WordPress 网站上设置推送。
自定义代码
为希望通过代码自定义一切的开发人员提供完全控制设置。
- 网站名称:用于默认通知标题
- 网站 URL:必须与您的域名来源完全匹配(不包含路径或
www不匹配) - 自动重新订阅:推荐 - 自动重新订阅清除了浏览器数据的返回用户
- 默认图标 URL:在通知中显示的
256x256像素图像(如果未设置,将使用默认的铃铛图标)
自动重新订阅
如果用户清除了浏览器数据,他们将停止接收推送通知。启用此选项可在用户返回您的网站时自动重新订阅他们。请参阅订阅获取更多详情。
网页权限提示
提示用户授予通知权限对于选加入至关重要。您可以根据设置自定义权限请求的行为和外观。网页权限提示
比较不同的提示类型(下拉式、基于类别的、原生、订阅铃铛等)并了解何时使用每种。
Web SDK 参考
了解如何使用 SDK 编程控制提示的显示时机和方式。
欢迎通知
您可以启用可选的确认推送,在用户订阅后立即发送。 常规和 WordPress 集成可以在仪表板中设置此功能。
OneSignal.init 函数中使用 welcomeNotification 对象。请参阅Web SDK 参考获取详情。
为什么要发送欢迎通知?
- 让用户知道他们已成功订阅
- 展示未来通知的样子
- 提供入门内容或后续步骤
用户和订阅
当用户订阅推送时,OneSignal 会自动创建与其浏览器/设备绑定的唯一订阅。 网页推送订阅在以下情况下创建:- 使用特定浏览器和设备在您的网站上授予推送通知权限
- 清除浏览器数据后返回您的网站(如果启用了自动重新订阅)
- 从新的浏览器或设备订阅
每个浏览器/设备组合都会创建单独的订阅。隐身/私密浏览模式无法创建订阅。网页推送订阅在您为其分配外部 ID 之前保持匿名。

用户
了解如何管理用户、分配外部 ID 并跟踪他们的活动。
订阅
了解订阅在不同浏览器和设备上的工作原理。
用户群体
根据行为、设备等将用户分组为群体进行定向。
iOS 支持
Apple 为运行 iOS 16.4+ 的 iPhone 和 iPad 添加了网页推送支持,但有更严格的要求:- 用户必须将您的网站添加到主屏幕
- 权限提示仅在该步骤后显示
- 通知一旦启用,就像原生应用警报一样运作
iOS 网页推送
启用 iOS 支持的分步指导,包括服务工作者和清单设置。
让您的受众添加到主屏幕
鼓励用户安装您的网站以便他们可以接收 iOS 网页推送的技巧。
设计网页推送通知
制作有效的推送通知不仅仅涉及编写文本。了解哪些元素是可自定义的以及如何有效使用它们。
- 标题:吸引注意力的标题(建议:低于
50个字符) - 消息:主要通知内容(建议:低于
120个字符) - 图标:您的品牌图标或特定通知图像(建议:
256x256像素PNG 或 JPG) - 大型图像:吸引眼球的视觉内容
- 操作按钮:行动召唤按钮
- 浏览器:显示推送的浏览器/应用
- 域名:您的网站来源由浏览器自动设置
- 时间戳和关闭:浏览器添加这些控制
- 更多选项:浏览器特定的额外控制
推送概览
推送通知创建、选项和传递行为的完整概览。
模板
使用可重复使用的模板进行一致的消息传递,节省时间。
消息个性化和本地化
您可以自定义推送消息以匹配每个用户的偏好和语言。消息个性化
插入动态变量(如姓名或偏好)来定制消息。
多语言消息
以每个用户的首选语言自动传递消息。
配置网页推送行为
控制推送消息发送后的行为——何时显示、存储多长时间以及用户如何交互。推送、显示和关闭设置
限流
控制通知传递速度。
频率限制
设置限制以防止向同一用户过度发送通知。
生存时间 (TTL)
定义设备离线时推送服务保留消息的时间。
网页推送主题
使用主题来分组、更换或抑制重复通知。
点击行为
控制用户点击通知时发生的情况。 **默认情况:**点击打开您的主页。 自定义它:- 将用户导向特定 URL
- 使用 UTM 跟踪
- 使用
?_osp=do_not_open抑制默认行为
URL、链接和深度链接
使用深度链接和跟踪将用户路由到相关内容或页面。
操作按钮
让用户从您的通知中立即采取操作。
SDK 推送通知事件监听器
监听点击事件并使用自定义代码触发应用内行为。
测试您的设置
在发布之前,彻底测试您在各种设备和浏览器上的网页推送实现。发布前检查清单
- SDK 正确加载且无错误
- 权限提示出现并正常运行
- 测试通知已发送和接收
- 图标和图像正确渲染
- 服务工作者已注册并是最新版本
- HTTPS 证书有效
推送分析和故障排除
衡量通知性能并解决常见交付问题:推送消息报告
查看每条消息的传递、打开率和点击率指标。
分析概览
探索各渠道的参与度和用户行为指标。
通知未显示或延迟
如果消息未出现的故障排除检查清单。
通知图像未显示
修复不同浏览器中的图像渲染问题。
后续步骤
A/B 测试
通过实验优化消息,找到能驱动参与的内容。
历程
构建由用户行为触发的自动化多步骤消息流程。
标签
添加用户级别数据用于个性化和定向。
分析
跟踪各渠道的参与度和转化指标。
常见问题解答
iOS 上的用户可以订阅网页推送吗?
可以,从 iOS 16.4+ 开始。用户必须先将您的网站添加到主屏幕,然后授予通知权限。完整设置步骤请参阅 iOS 网页推送。为什么用户停止接收网页推送通知?
最常见的原因是用户清除了浏览器数据,这会删除推送订阅。在您的网页推送设置中启用自动重新订阅,以自动重新订阅回访用户。详情请参阅订阅。网页推送通知在无痕模式或隐私浏览模式下有效吗?
不。用户在无痕模式或隐私浏览模式下无法订阅网页推送。在普通会话中创建的订阅在隐私模式下无法访问。哪些浏览器支持网页推送通知?
Chrome、Firefox、Safari(macOS 和 iOS 16.4+)以及 Edge 都支持网页推送。每个浏览器可能有不同的提示行为和通知显示方式。浏览器特定详情请参阅网页推送常见问题解答。我可以在网页推送中使用子域名吗?
每个子域名(例如,app.example.com 与 shop.example.com)都是独立的源。浏览器为网页推送强制执行同源策略,因此每个子域名都需要自己的 OneSignal 应用。Service Worker 还必须托管在与订阅页面相同的源上——不允许使用 CDN 和其他子域名。有关设置选项,请参阅多站点和子域名。