我正在尝试在我的React应用程序中使用Node Express服务器实现推送通知。我在webPush中使用VAPID密钥。不幸的是,当我尝试发送推送通知时,我得到了一个403错误
- 授权标头中的密钥与用于订阅此用户的发件人ID不对应。请确保您在Firebase控制台中使用了正确的发件人ID和服务器密钥 *
**你知道如何处理这个错误,甚至它意味着什么吗?**我的密钥通过webpush.generateVAPIDKeys()
生成。
我没有使用Firebase或其他任何东西,我有自己的服务器,所以我不想使用Firebase(如果我可以..)。
下面是我的代码的一些部分:
客户端**
export function registerPush() {
console.log('===registerPush===', process.env.REACT_APP_VAPID_PUBLIC_KEY)
const convertedVapidKey = process.env.REACT_APP_VAPID_PUBLIC_KEY
? urlBase64ToUint8Array(process.env.REACT_APP_VAPID_PUBLIC_KEY)
: ''
navigator.serviceWorker.ready
.then(function (registration) {
return registration.pushManager
.getSubscription()
.then(async function (subscription) {
if (subscription) {
return subscription
}
return registration.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: convertedVapidKey,
})
})
})
.then(function (subscription) {
fetch(`${process.env.REACT_APP_URL_BACK}notifications/subscribe`, {
method: 'POST',
body: JSON.stringify(subscription),
headers: {
'Content-Type': 'application/json',
},
})
})
}
serviceWorker
this.addEventListener('push', function (e) {
console.log('push', e)
var title = e.data.text()
e.waitUntil(this.registration.showNotification(title))
})
服务器
const webPush = require('web-push')
webPush.setVapidDetails(
process.env.VAPID_WEB_PUSH_CONTACT,
process.env.VAPID_PUBLIC_KEY,
process.env.VAPID_PRIVATE_KEY
)
app.post('/notifications/subscribe', (req, res) => {
const subscription = req.body
console.log(subscription)
const payload = JSON.stringify({
title: 'Hello!',
body: 'It works.',
})
webPush
.sendNotification(subscription, payload)
.then((result) => {
console.log(result)
res.status(200).json({ success: true })
})
.catch((e) => {
res.status(500).json({ success: false })
console.log(e)
})
})
2条答案
按热度按时间tquggr8v1#
确保您在客户端(创建sub时)和服务器端的公钥匹配。你使用的是env值,所以它们可能是这样的。
此外,请确保您有一个有效的urlBase64ToUint8Array函数,我有一个错误的实现,然后我转换的关键字“不符合”。
jvlzgdj92#
使用域名,如果使用IP地址,则Web推送可能无法工作