对于出海团队来说，用户获取成本越来越高，如何让已经触达的用户反复回访、持续转化，成了决定投放 ROI 的关键因素。PWA 推送通知（Push Notification）正是解决这个问题的利器——不需要上架 Google Play，不需要用户下载安装 APK，只要用户在 Android 浏览器中授权一次，就能通过系统级通知直接触达。2026 年，Web Push 在 Android Chrome、Samsung Internet、Edge 等主流浏览器上已经全面成熟，本文将从出海实操角度，手把手带你完成 Android PWA 推送通知的完整配置。
→ 想提升广告点击后的转化率？联系 DeepClick 获取方案
出海场景下，为什么 PWA 推送通知不可或缺
跨境电商、出海游戏、社交应用等业务场景中，用户通过 Meta Ads 或 Google Ads 点击广告进入落地页后，绝大部分不会立即转化。传统做法是通过再营销广告去”捞回”这些用户，但 CPM 持续走高，cookie 追踪能力又在退化。PWA 推送通知提供了一条零成本的”直连”通道：用户授权后，你可以在任意时间发送通知，将用户拉回你的 PWA 站点。
举几个典型出海场景：
- 跨境电商：用户浏览了商品但未下单，30 分钟后推送”限时优惠即将结束”提醒，挽回弃购。
- 出海游戏：通知玩家每日签到奖励、限时活动，提升日活和留存。
- 社交/内容平台：推送好友动态、新内容更新，增加打开频率。
- SaaS 工具：提醒用户完成未完成的操作流程或试用到期通知。
相比原生 App 推送，PWA 推送的最大优势在于免安装——用户在浏览器中访问你的网站，授权通知权限，即可开始接收。这对于还没有在目标市场建立 App 下载心智的出海团队来说，是极具性价比的留存手段。
前置条件：HTTPS、Service Worker 与 Manifest
在开始配置推送通知之前，确保你的 PWA 满足以下基本要求：
HTTPS 是强制要求。Service Worker 只能在安全源（HTTPS）下注册，这是浏览器的硬性安全策略。出海站点建议使用 Cloudflare 或类似 CDN 服务，既能获取免费 SSL 证书，又能加速全球访问。如果你的落地页加载速度还没有优化到位，这一步也值得一并处理。
Service Worker 文件。Service Worker 是服务器和浏览器之间的”桥梁”，负责处理后台推送事件。即使用户没有打开你的网页，Service Worker 也能接收推送消息并展示通知。你需要在网站根目录创建一个 sw.js 文件。
Web App Manifest。配置 manifest.json，包含应用名称、图标、启动 URL、显示模式等信息。这不仅是推送通知的基础，也是 PWA 可安装性的核心配置。
第一步：配置 Firebase Cloud Messaging（FCM）
FCM 是目前 Web Push 最主流的推送服务。配置步骤如下：
- 创建 Firebase 项目：进入 Firebase Console，新建项目，在”项目设置 → Cloud Messaging”中确认 Cloud Messaging API (V2) 已开启。
- 获取 VAPID 密钥：在”Web 推送证书”区域生成密钥对，复制公钥用于前端订阅。
- 安装 Firebase SDK：在前端项目中安装并初始化 Firebase。
- 创建 firebase-messaging-sw.js：这是 Firebase 要求的专用 Service Worker 文件，放在网站根目录，负责处理后台消息。
// firebase-messaging-sw.js
importScripts('https://www.gstatic.com/firebasejs/10.12.0/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/10.12.0/firebase-messaging-compat.js');
firebase.initializeApp({
apiKey: "你的_API_KEY",
projectId: "你的项目ID",
messagingSenderId: "你的发送者ID",
appId: "你的应用ID"
});
const messaging = firebase.messaging();
messaging.onBackgroundMessage((payload) => {
const { title, body, icon } = payload.notification;
self.registration.showNotification(title, {
body,
icon: icon || '/icons/icon-192.png'
});
});第二步：注册 Service Worker 并获取推送令牌
在主页面的 JavaScript 中注册 Service Worker，并在用户授权后获取 FCM 推送令牌：
// 注册 Service Worker
if ('serviceWorker' in navigator) {
const registration = await navigator.serviceWorker.register('/firebase-messaging-sw.js');
console.log('SW 注册成功:', registration.scope);
}
// 获取推送令牌
import { getMessaging, getToken } from 'firebase/messaging';
const messaging = getMessaging();
async function subscribeToPush() {
const token = await getToken(messaging, {
vapidKey: '你的VAPID公钥',
serviceWorkerRegistration: await navigator.serviceWorker.ready
});
if (token) {
// 将 token 发送到你的服务器存储
await fetch('/api/save-token', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token })
});
}
}拿到的 token 需要存储在后端数据库中，后续发送推送时通过 FCM API 指定 token 推送到对应设备。
第三步：正确处理通知权限请求
通知权限请求是整个流程中最关键的 UX 环节。千万不要在页面加载时直接弹出浏览器原生权限弹窗——Chrome 已经会对这种行为进行抑制，甚至自动拒绝。
推荐采用渐进式展示的两步法：
- 先展示自定义提示：用自己的 UI 组件（横幅、弹窗、卡片）向用户说明通知的价值，例如”开启通知，第一时间获取专属折扣”。
- 用户点击”开启”后，再调用浏览器原生权限 API：只对有明确意愿的用户触发授权，大幅提升同意率。
一旦用户在原生弹窗点击”拒绝”，你就无法再次请求——只能引导用户手动到浏览器设置中开启。所以这一步务必谨慎。
第四步：推送消息处理与 Android 富通知
Android Chrome 支持丰富的通知功能，出海团队应充分利用：
- 富媒体图片：通过
image属性在通知中展示大图，适合电商促销场景。 - 操作按钮：最多添加两个行动按钮（如”立即购买””稍后查看”），降低用户决策门槛。
- 角标（Badge）：状态栏小图标，增强品牌辨识度。
- 分组与替换：用
tag属性对同类通知分组，避免用户收到过多相似通知。
self.addEventListener('push', (event) => {
const data = event.data ? event.data.json() : {};
event.waitUntil(
self.registration.showNotification(data.title || '新消息', {
body: data.body || '您有一条新通知',
icon: '/icons/icon-192.png',
image: data.image,
actions: [
{ action: 'open', title: '查看详情' },
{ action: 'dismiss', title: '稍后再说' }
],
data: { url: data.click_url || '/' }
})
);
});第五步：点击追踪与留存指标
发送通知只是开始，效果衡量同样重要。在 Service Worker 中监听 notificationclick 事件，记录点击行为：
self.addEventListener('notificationclick', (event) => {
event.notification.close();
const targetUrl = event.notification.data?.url || '/';
event.waitUntil(
fetch(`/api/track-click?tag=${event.notification.tag}`)
.then(() => clients.openWindow(targetUrl))
);
});关键指标包括：
- 送达率：成功推送到设备的比例。
- 点击率（CTR）：用户点击通知的比例。
- 转化率：点击后完成目标动作（下单、注册等）的比例。
- 退订率：用户关闭通知权限的比例。
结合无 Cookie 的点击后追踪方案，可以构建完整的用户旅程分析，从广告点击到推送召回，打通全链路数据。
出海常见踩坑与解决方案
Android 电池优化导致通知被屏蔽。这是出海最常遇到的问题之一。小米、OPPO、vivo、华为等中国品牌手机在海外市场份额不低，它们的系统级省电策略比原生 Android 更激进，可能会杀死 PWA 的后台 Service Worker。解决方案是在用户引导流程中加入”关闭电池优化”的操作指引。
不同地区的用户对通知的接受度差异大。东南亚市场用户对推送通知接受度较高，欧美用户则更敏感。建议根据目标市场调整推送频率和内容策略，避免因过度推送导致退订。
FCM 在部分地区的可达性问题。FCM 依赖 Google 服务，在 Google 服务受限的地区可能不可靠。出海团队需要根据目标市场评估是否需要备用推送通道。
Token 过期与刷新。FCM Token 会在用户清除浏览器数据或浏览器更新时失效。务必实现 token 刷新机制，定期清理无效 token，避免推送失败率攀升。
实施清单
最后，总结一份可执行的配置清单：
- 确认网站使用 HTTPS，SSL 证书有效。
- 创建并注册 Service Worker，处理 push 和 notificationclick 事件。
- 配置 Firebase Cloud Messaging 项目，获取 VAPID 密钥。
- 实现两步权限请求——先自定义提示，再触发原生弹窗。
- 利用 Android 的富通知功能——大图、操作按钮、角标。
- 搭建后端 Token 存储，实现刷新与清理逻辑。
- 接入数据追踪，监控送达率、点击率、转化率、退订率。
- 针对目标市场的电池优化问题提供用户引导。
- 根据市场差异制定推送频率与内容策略。
- 在 Chrome、Samsung Internet、Edge 等多浏览器上充分测试。
PWA 推送通知是出海团队低成本留存用户的核心武器。配合智能流量分发和精细化的落地页优化，你可以在不依赖应用商店的前提下，构建一套完整的用户触达和再营销体系。
广告有点击，但转化一直上不去？
DeepClick 专注 Meta 广告点击后链路优化，通过回流、再曝光与落地页优化，帮助出海广告团队平均提升 CVR 30%+，降低 CPA。
→ 预约免费诊断
发表评论