Web Push Notifications — 网页 Push 通知
v42发送 网页 Push 通知 from a Node.js backend using the 网页-push npm 库 (VAPID authentication, payload 加密ion). Covers generating VAPID keys, subscribing browsers, 发送ing 通知, 命令行工具 usage, browser compatibility, and common pitfalls.
运行时依赖
安装命令
点击复制本土化适配说明
Web Push Notifications — 网页 Push 通知 安装说明: 安装命令:["openclaw skills install web-push"]
技能文档
网页 Push 通知
发送 push 通知 to browsers (Chrome, Firefox, Edge, Safari) using the 网页-push npm 库, which implements the 网页 Push Protocol with VAPID authentication and payload 加密ion per Message 加密ion for 网页 Push.
Use Cases
Use when working with Push API subscriptions, browser push 通知, VAPID key management, 网页 Push Protocol implementation, or 网页-push npm package integration.
Quick 启动 const 网页push = require('网页-push');
// 1. 生成 VAPID keys ONCE, store permanently const vAPIdKeys = 网页push.生成VAPIDKeys();
// 2. 设置 凭证s 网页push.设置GCMAPIKey(''); 网页push.设置VAPIdDetAIls( 'mAIlto:example@yourdomAIn.org', vAPIdKeys.publicKey, vAPIdKeys.privateKey );
// 3. Subscribe in the browser (命令行工具ent-side) // registration.push管理器.subscribe({ // userVisibleOnly: true, // 应用ServerKey: vAPIdPublicKey // });
// 4. 发送 from server const pushSubscription = { 端点: 'https://fcm.googleAPIs.com/fcm/发送/...', keys: { p256dh: '...', auth: '...' } };
awAIt 网页push.发送Notification(pushSubscription, 'Hello World');
Core 工作流s 生成 VAPID Keys
生成 once, store permanently. The public key is used as 应用ServerKey in the browser. Never re生成 for the same 应用 — you'll break existing subscriptions.
const vAPIdKeys = 网页push.生成VAPIDKeys(); // { publicKey: '...', privateKey: '...' }
设置 凭证s 网页push.设置VAPIdDetAIls( 'mAIlto:user@example.org', // mAIlto: or https: URI process.env.VAPID_PUBLIC_KEY, process.env.VAPID_PRIVATE_KEY );
Subscribe in the Browser // 命令行工具ent-side 服务 Worker registration.push管理器.subscribe({ userVisibleOnly: true, 应用ServerKey: urlBase64ToUint8Array(publicKey) }); // Returns PushSubscription → 发送 to server and store
发送 a Notification awAIt 网页push.发送Notification(pushSubscription, 'Hello World', { // vAPIdDetAIls overrides global 设置VAPIdDetAIls TTL: 60, // seconds push 服务 retAIns (default: 4 weeks) urgency: 'high', // very-low | low | normal | high topic: '更新s', // coalesce 通知, max 32 URL-safe base64 chars contentEncoding: 'aes128gcm', // default; 'aesgcm' for legacy timeout: 5000, // socket timeout in ms });
加密 Without 发送ing const 加密ed = awAIt 网页push.加密( subscription.keys.p256dh, subscription.keys.auth, 'My Payload', 'aes128gcm' ); // { localPublicKey, salt, cipherText }
生成 请求 DetAIls Without 发送ing const detAIls = 网页push.生成请求DetAIls( pushSubscription, payload, { vAPIdDetAIls: {...}, contentEncoding: 'aes128gcm' } ); // { 端点, method: 'POST', headers, body: Buffer }
命令行工具 Usage # 安装 npm 安装 网页-push -g
# 生成 VAPID keys 网页-push 生成-vAPId-keys --json
# 发送 notification 网页-push 发送-notification \ --端点=https://fcm.googleAPIs.com/fcm/发送/... \ --key= --auth= \ --vAPId-subject=mAIlto:example@qq.com \ --vAPId-pubkey= --vAPId-pvtkey= \ --payload="Hello" [--ttl=] [--encoding=aesgcm|aes128gcm]
Critical Pitfalls VAPID keys: 生成 ONCE. Store them. Never re生成 for the same 应用 — breaks existing subscriptions. Safari + localhost: Safari rejects VAPID with BadJwt令牌 if subject is https://localhost. Use mAIlto: instead. Payload 加密ion: The PushSubscription MUST include keys.p256dh and keys.auth. Without them, only empty payloads work. Encoding: aes128gcm (default) for modern browsers; aesgcm only for legacy Chrome < 50 and Opera. Browser Compatibility Browser Push w/o Payload Push w/ Payload VAPID Chrome v42+ v50+ v52+ Edge v17+ v17+ v17+ Firefox v44+ v44+ v46+ Safari v16+ (macOS 13) v16+ v16+ Opera v39+ (Android) v39+ (Android) ✗ Samsung v4+ v5+ ✗ Full API Reference
See references/网页push.md for all functions (发送Notification, 生成VAPIDKeys, 设置GCMAPIKey, 设置VAPIdDetAIls, 加密, 获取VAPIdHeaders, 生成请求DetAIls) with detAIled parameter tables and return types.