Send web push notifications from Nuxt
Web push on Nuxt works through the same InstantPWA snippet you add for install prompts — placed in nuxt.config.ts head[] or useHead() via nuxt.config.ts → app.head.script[] or useHead() in app.vue. Once a visitor opts in, you can send push notifications from your InstantPWA dashboard to anyone who granted permission, including installed home-screen users on iOS 16.4+.
Steps
- 1
Open nuxt.config.ts head[] or useHead()
Go to nuxt.config.ts → app.head.script[] or useHead() in app.vue.
- 2
Paste the InstantPWA snippet
Drop the one-line async script tag in the Nuxt head section — no build step or dependency install.
- 3
Enable push in your dashboard
Turn on Web Push in InstantPWA settings and upload your notification icon and default badge.
- 4
Publish and collect opt-ins
Once live on Nuxt, the popup asks for notification permission after install (or standalone, if you enable prompt-first push).
- 5
Send a test push
Send a test notification from the dashboard to your own opted-in browser before sending to all subscribers.
Constraints to know
- Works across SSR, SSG (nuxt generate) and hybrid rendering, but if you use routeRules to prerender only some routes, add the snippet at the root app.vue level so every route inherits it.
- @nuxtjs/pwa (if installed) already registers its own service worker — InstantPWA detects an existing worker and won't double-register one, but confirm scope conflicts if you customize @nuxtjs/pwa's default scope.
FAQ
Does web push work without the visitor installing the app?+
On Chromium browsers and desktop, yes. On iOS Safari, push requires the visitor to add the site to their home screen first (iOS 16.4+).
Can I segment who receives a push?+
Yes — the InstantPWA dashboard supports targeting by page visited, device type and custom events you send from your site.
Is there anything Nuxt-specific I need to configure for push?+
No — push registration is handled entirely by the InstantPWA snippet once it's live on Nuxt; there's no separate push API key to manage.