带 Onesignal、Nuxtjs 和 Prismic CMS 的动态推送通知
Dynamic push notifications w/ Onesignal, Nuxtjs and Prismic CMS
我正在使用 Nuxtjs 构建一个 PWA,它从 prismic api. OneSignal has been installed and configured following the documentation provided here 获取博客内容,我能够为用户订阅该应用程序,并通过 OneSignal 的仪表板发送欢迎推送和其他推送。
我现在想在博客 post 有新内容时发送推送通知。任何帮助将不胜感激。
编辑
每当用户访问 https://example.com/blog 时,我都会触发推送通知。注意:prismic 按最新的 post 排序,因此 this.docs[0]
从数组中获取最新的文章。
async fetch() {
try {
const query = await this.$prismic.api.query(this.$prismic.predicates.at('document.type', 'blog_posts'), {pageSize: 6}).then((query)=>{
this.docs = query.results;
const requestOptions = {
method: "POST",
headers: {"Content-Type": "application/json", "Authorization": `Basic ${process.env.API_KEY}`},
body: JSON.stringify({
app_id: process.env.APP_ID,
included_segments: ["All"],
contents: {en: this.docs[0].data.post_content[0].text},
headings: {en: this.docs[0].data.post_title[0].text},
chrome_web_image: this.docs[0].data.featured_image.url,
big_picture: this.docs[0].data.featured_image.url,
web_url: `https://example.com/blog/${this.docs[0].uid}`
})
}; fetch('https://onesignal.com/api/v1/notifications', requestOptions)
})
} catch (e) {
// Send to bugsnag
console.log(e)
}
}, fetchDelay: 500,
Prismic 允许您设置在发布文档时触发的 webhook。参见 prismic blog。使用 express,我创建了一个可以做两件事的工具:
- 从 prismic
获取所有博客 post
- 发布 post 时发送 onesignal 网络推送通知
在此处查看代码片段:https://gitlab.com/-/snippets/2003202
参考文献:
我正在使用 Nuxtjs 构建一个 PWA,它从 prismic api. OneSignal has been installed and configured following the documentation provided here 获取博客内容,我能够为用户订阅该应用程序,并通过 OneSignal 的仪表板发送欢迎推送和其他推送。
我现在想在博客 post 有新内容时发送推送通知。任何帮助将不胜感激。
编辑
每当用户访问 https://example.com/blog 时,我都会触发推送通知。注意:prismic 按最新的 post 排序,因此 this.docs[0]
从数组中获取最新的文章。
async fetch() {
try {
const query = await this.$prismic.api.query(this.$prismic.predicates.at('document.type', 'blog_posts'), {pageSize: 6}).then((query)=>{
this.docs = query.results;
const requestOptions = {
method: "POST",
headers: {"Content-Type": "application/json", "Authorization": `Basic ${process.env.API_KEY}`},
body: JSON.stringify({
app_id: process.env.APP_ID,
included_segments: ["All"],
contents: {en: this.docs[0].data.post_content[0].text},
headings: {en: this.docs[0].data.post_title[0].text},
chrome_web_image: this.docs[0].data.featured_image.url,
big_picture: this.docs[0].data.featured_image.url,
web_url: `https://example.com/blog/${this.docs[0].uid}`
})
}; fetch('https://onesignal.com/api/v1/notifications', requestOptions)
})
} catch (e) {
// Send to bugsnag
console.log(e)
}
}, fetchDelay: 500,
Prismic 允许您设置在发布文档时触发的 webhook。参见 prismic blog。使用 express,我创建了一个可以做两件事的工具:
- 从 prismic 获取所有博客 post
- 发布 post 时发送 onesignal 网络推送通知
在此处查看代码片段:https://gitlab.com/-/snippets/2003202
参考文献: