iPhone 和 iPad 上的 Web 推送
使用 iOS 和 iPadOS 16.4 或更高版本的 iPhone 和 iPad 用户,在将您的网站添加到主屏幕后,即可接收来自该网站的 Web 推送通知。
iPhone 和 iPad 上的 Web 推送何时生效
Anchor link toiOS 和 iPadOS 上的 Web 推送仅适用于从主屏幕图标打开的网站。在普通的 Safari 标签页中,浏览器完全不提供推送功能,因此 Web SDK 会在不启用推送的情况下初始化,访问者无法订阅。
要接收通知,用户需要:
- 一台运行 iOS 或 iPadOS 16.4 或更高版本的 iPhone 或 iPad。
- 已将您的网站添加到主屏幕,并从该图标打开。
- 在点击您网站上的元素后允许通知。
您的网站需要什么
Anchor link to按照与桌面浏览器相同的方式集成 Web SDK,然后添加 Web 应用清单(manifest):
-
按照 Web push SDK 3.0 集成 SDK 和 Service Worker。如果您的网站已有自己的 Service Worker,请按照渐进式 Web 应用支持操作。
-
添加一个 Web 应用清单,将
display设置为standalone或fullscreen,并在每个页面中链接该清单:manifest.json {"name": "Example Store","short_name": "Store","start_url": "/","display": "standalone","icons": [{ "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }]}<link rel="manifest" href="/manifest.json"> -
在用户点击时请求通知权限。iOS 和 iPadOS 仅在响应用户的直接操作时才会显示权限对话框,因此请使用订阅小组件或调用
Pushwoosh.subscribe()的按钮:<button onclick="Pushwoosh.subscribe()">Get notifications</button>
如何在 Pushwoosh 中找到 iPhone 和 iPad 订阅者
Anchor link toPushwoosh 会将 iPhone 和 iPad Web 订阅者注册在 Chrome 平台下,因此统计数据不会单独显示他们,也没有任何默认标签能够可靠地识别此类设备。
要定位这些订阅者,请从网站设置您自己的标签:
-
在网站发送标签之前,先在 Control Panel 中创建自定义标签,例如一个名为
Web App Platform的 String 标签。取消勾选默认选中的用户特定复选框。这样会创建一个按设备存储的通用标签。如果跳过此步骤,
setTags会自动将该标签创建为用户特定标签。其值由具有相同 User ID 的所有设备共享,因此一旦网站调用registerUser,该用户的桌面浏览器也会获得ios值,并收到您通过此标签定位到 iPhone 和 iPad 订阅者的消息。 -
当网站在 iPhone 或 iPad 上从主屏幕运行时设置该标签:
Pushwoosh.push((api) => {// iPadOS Safari reports a Mac user agent, so a touch screen marks an iPadconst isIos = /iPhone|iPad/.test(navigator.userAgent)|| (/Macintosh/.test(navigator.userAgent) && navigator.maxTouchPoints > 1);const isIosHomeScreen = isIos && (window.navigator.standalone === true|| window.matchMedia('(display-mode: standalone)').matches);if (isIosHomeScreen) {api.setTags({ 'Web App Platform': 'ios' });}}); -
使用一台测试 iPhone 或 iPad 进行订阅。
-
在用户探索器中检查该设备上的标签值。即使 Pushwoosh 没有保存该值(例如账户关闭了标签自动创建),
setTags也会返回成功,因此仅凭代码无法确认值已保存。 -
基于此标签构建细分,仅向 iPhone 和 iPad 订阅者发送消息。