Skip to content
For developers · 8 min read

How web push works, step by step

The standards behind every browser notification — Push API, Notifications API, service workers and VAPID — explained without hand-waving, plus what Pusharoo handles for you.

Get started — freeTry a live notification
Updated By the Pusharoo team
In short
  • Web push is built from open W3C/IETF standards: Push API, Notifications API, Service Workers, RFC 8030 (push protocol), RFC 8291 (encryption) and RFC 8292 (VAPID).
  • The browser gives you a unique endpoint URL per subscriber; you POST an encrypted payload to it.
  • Your sw.js must be served from your own origin — that’s a browser security rule, not a vendor choice.
  • Expired endpoints answer 404 or 410 and should be deleted.

The four moving parts

  1. Your page registers a service worker (/sw.js) and, after the visitor agrees, calls pushManager.subscribe() with your public VAPID key.
  2. The browser asks its vendor’s push service for a unique endpoint and returns a PushSubscription: the endpoint URL plus two keys (p256dh and auth) used to encrypt messages for that browser.
  3. Your server (Pusharoo) stores the subscription. To send, it encrypts the payload (RFC 8291), signs a short JWT with the VAPID private key (RFC 8292) and POSTs it to the endpoint (RFC 8030).
  4. The push service queues it and delivers when the device is online. The service worker wakes up, receives a push event and calls showNotification().
How a web push notification travelsYour website asks permission; the browser creates a subscription; Pusharoo stores it; when you send, Pusharoo hands an encrypted message to the browser vendor push service, which delivers it to the device even when your site is closed.🌐Your websitesw.js + one script tagasks🧭Visitor’s browsertaps Allow → subscriptionsaves🦘Pusharoostores endpoint, signs with VAPIDencrypts📡Browser push serviceGoogle · Mozilla · Apple · Microsoft🔔 Lands on their screendesktop, Android, iPhone Home Screen appYou do steps 1–2 once. Everything after“You hit Send” is automatic.How a web push notification travelsYour website asks permission; the browser creates a subscription; Pusharoo stores it; when you send, Pusharoo hands an encrypted message to the browser vendor push service, which delivers it to the device even when your site is closed.🌐Your websitesw.js + one script tagasks🧭Visitor’s browsertaps Allow → subscription🦘Pusharoostores it, signs with VAPID📡Browser push serviceGoogle · Mozilla · Apple🔔 Lands on their screen
The full journey of one notification. Only the first two boxes live on your site.

Why the service worker must live on your domain

A service worker can only control pages within its own origin and scope. That’s why every push tool — Pusharoo included — asks you to upload a file that opens at https://yoursite.com/sw.js. A script hosted on someone else’s domain can’t receive pushes for yours.

This is also what makes ownership real: the subscription is created on your origin. Already have a service worker (for a PWA or caching)? Don’t register a second one — import Pusharoo into it with importScripts(), as shown in the docs.

VAPID keys in plain words

VAPID (Voluntary Application Server Identification) is a key pair. The public half is baked into every subscription; the private half signs each send. Push services reject a message signed with the wrong key. Two practical consequences:

  • Keep the private key secret and backed up. If it’s lost, every subscriber has to opt in again.
  • A subscription list is only portable together with the keys that created it. More in owning your push list.

What a notification can contain

Up to roughly 4 KB of encrypted data, which the service worker turns into a notification: title, body, icon, optional large image (Chrome/Edge on Windows and Android), a click URL, and on some browsers action buttons. Pusharoo uses your site’s own name and icon, so nothing says “Pusharoo”.

Subscription lifecycle and cleanup

Endpoints don’t live forever. When a visitor clears site data, revokes permission or reinstalls a browser, the push service starts answering 404 Not Found or 410 Gone. Good senders delete those immediately. Pusharoo does this automatically on every send and in a daily cleanup, so your counts stay honest — see stats for sent, expired and clicked on each campaign.

What Pusharoo handles vs. what you do

YouPusharoo
Upload sw.js to your rootVAPID keys, encryption, signing and delivery
Paste one script tagBranded soft prompt, frequency caps, iPhone hint card
Write the messageQueue, schedules, automations, segments, retries
(Optional) a manifest for iPhone404/410 cleanup, stats, signed webhooks

Ready? The setup guide has copy-paste snippets for plain HTML, WordPress and Cloudflare.

Questions

Do I need Firebase or an Apple developer account?

No. Standard web push with VAPID works without Firebase Cloud Messaging or an Apple developer account. The browsers’ push services accept VAPID-signed messages directly.

Does web push work over HTTP?

No. Service workers and the Push API require HTTPS (localhost is the only exception for development).

Can I send to a subscriber when their device is off?

Yes. The push service holds the message (for a limited time) and delivers it when the device reconnects.

Which library does Pusharoo use?

Pusharoo runs on PHP 8.4 with the open-source minishlink/web-push library, which implements RFC 8030, 8291 and 8292.

What are web push notifications?

The 60-second explainer: what they are, where they appear, and why visitors actually see them.

Self-hosted web push and owning your list

Endpoints + VAPID keys = a list you control. What self-hosting means and what it costs you.

Browser push notifications: who supports what

Support table for Chrome, Edge, Firefox, Safari, Opera and Samsung Internet — desktop, Android and iPhone.

The push opt-in prompt, done right

Two-step soft prompts, timing rules, copy that converts, and what never to do on page load.

More in Basics: Web push on iPhone and iPad, explained honestly · Push notifications: what the term actually means · Web push vs. email: which to use, and when · Push notifications vs. SMS text messages · Web push vs. mobile app push notifications · All guides

Free for life. No limits.

Unlimited subscribers, campaigns and automations. No badges. About five minutes to install.

Get startedTry a live notification