iOS 16 Home Screen Web App Push Notifications
With the release of iOS 16.4, Apple enabled Web Push notification support for Progressive Web Apps (PWAs) saved to an iPhone or iPad Home Screen. This functionality bridges the gap between native iOS applications and web applications, allowing developers to send standard W3C Web Push alerts directly to users. This article explains how this architecture operates, the requirements for enabling notifications, the underlying technical pipeline, and how these alerts integrate with the native iOS operating system.
Prerequisites and Activation
Web Push notifications do not function inside regular Safari browser tabs on iOS. Instead, they require the web application to be installed directly to the user's device:
- The user must navigate to the website and select Add to Home Screen from the share menu.
- The user must open the newly created Home Screen icon to launch the web app in standalone mode.
- Notification permissions can only be requested through an explicit user gesture, such as tapping an "Enable Notifications" or "Subscribe" button within the installed app interface.
Technical Architecture
The feature is built on standard web technologies rather than proprietary Apple protocols, requiring no Apple Developer Program membership to implement:
- Standards Compliant: iOS uses the W3C Push API, Notifications API, and Badging API, standardizing implementation across platforms.
- Apple Push Notification service (APNs): When a user grants permission, the web app requests a push subscription. The browser engine generates an endpoint hosted by APNs. Your backend server sends encrypted payloads to this APNs endpoint using the standard Web Push protocol (RFC 8030 and RFC 8292 with VAPID keys).
- Service Workers: When a push payload reaches the
device, iOS wakes the web app’s registered Service Worker in the
background. The
pushevent fires inside the Service Worker, which then callsshowNotification()to display the alert.
System-Level Integration
Once permission is granted, iOS treats the Home Screen web app's notifications identically to native app notifications:
- Notification Management: The web app appears in the main iOS Settings > Notifications list under its manifest name, allowing users to customize alert styles, sounds, and grouping.
- Lock Screen and Notification Center: Alerts appear on the Lock Screen, inside the Notification Center, and on paired Apple Watches.
- Focus Modes: Notifications respect iOS Focus modes (such as Do Not Disturb, Work, or Sleep) and can be included in Scheduled Summaries.
- Badging API: Developers can set and clear numeric
notification badges directly on the Home Screen app icon using the
standard
navigator.setAppBadge()andnavigator.clearAppBadge()calls.