Websites · Glossary
What are web push notifications?
Web push notifications are short alerts a website can send to a person's browser or installed web app after they grant permission, appearing like app notifications even when the site is closed. They use the browser's push service and a background script called a service worker, and they work on desktop browsers, Android and, for home screen web apps, iPhone.
Web push brings app style notifications to websites. Each one needs the person's explicit permission, and each browser routes it through its own push service.
Nuwan Madhusanka · Co-founder
3 min read · Published
How web push works
The site asks permission, and the browser creates a subscription: a unique endpoint on its push service plus encryption keys. The site's server stores that subscription. To notify, the server sends an encrypted message to the endpoint, the push service delivers it to the device, and the service worker shows the notification, even if no tab is open.
Permission is everything
Browsers only show the permission prompt in response to a user action on many platforms, and a refused prompt is hard to undo. Ask at a moment when the value is obvious, such as an owner turning on order alerts, not on the first page load of a stranger.
Platform differences
Chrome, Edge and Firefox on desktop and Android support web push in the browser. On iPhone and iPad, web push works for web apps added to the home screen, from iOS 16.4 onward, and newer Safari versions support a declarative format that can show notifications without custom worker code.
Common mistakes
Prompting every visitor on arrival, sending marketing pushes nobody asked for, never cleaning up expired subscriptions, and logging subscription endpoints, which act as secrets: anyone with one can send to that device. Good systems delete a subscription when the push service reports it gone.
Where it shows up in OneCraft
Web push is used for the site owner, not for visitors. The sites admin installs as a web app, and the Push notifications card switches alerts on per device for new paid orders and new form messages, with Send test to check. On iPhone the admin must be added to the home screen first. Subscriptions that stop working are removed automatically.
Questions people ask
Do web push notifications need an app?
No. They work in desktop and Android browsers directly, and on iPhone for web apps added to the home screen. The website registers a service worker and asks permission; no app store download is involved, which is the main attraction for small businesses.
Can I send push notifications to my website visitors?
Technically websites can, with each visitor permission, if the platform supports it. Many small business builders only offer push to the owner for orders and messages. If you do push to customers, send rarely and only what they asked for, or they will block you.
Do web push notifications work when the browser is closed?
On most desktops the browser must be running in the background to receive them, which it often is. On Android and on iPhone home screen web apps, the system delivers them like app notifications. Delivery can be delayed when a device is in a power saving mode.
How do I turn off web push notifications?
In the browser site settings, change notifications for that site to block, or on a phone, change the notification setting for the installed web app. Most sites that send pushes also have their own switch, which removes the subscription on their side.
Are web push notifications secure?
Messages are encrypted for the subscription keys and delivered through the browser vendor push service over HTTPS. The weak point is the subscription endpoint, which should be treated as a secret and never logged or shared, since anyone holding it could send messages to that device.
Make one with websites
The button opens the generator with this use case already described. Change the wording to match your own.
Create a website with OneCraftRelated questions
- What is a PWA?What is a PWA? A website that can be installed to a phone home screen and opened full screen like an app, with an icon and an offline page. How it works.
- PWA vs native appPWA vs native app for a small business: cost, app store presence, device features, updates and review compared in a table, and how to choose between them.
- What is Expo for React Native?What is Expo? An open source framework and set of services for building iPhone, Android and web apps with React Native from one codebase. How it fits together.
Written and checked by the OneCraft team. Last checked .