Webpush solution architecture

Webpush for Chrome

1. Browser downloads Xtremepush javascript SDK from CDN.

2. SDK uses browser API to register service worker.

3. SDK uses browser API to subscribe for push notifications.

4. Browser communicates with GCM to subscribe and retrieve push token.

5. SDK sends the token to Xtremepush via HTTPS API.

6. Xtremepush servers communicates with GCM to send a message via secure connection.

7. GCM sends a push event to browser.

8. Browser executes a push callback handled in service worker.

9. Service worker fetches push message content from Xtremepush via HTTPS API.

10. Service worker uses browser API to show notification.

Webpush for Safari

1. Browser downloads Xtremepush javascript SDK from CDN

2. SDK uses browser API to subscribe for push notifications

3. Browser fetches push notification package from Xtremepush

4. Browser communicates with APNS to subscribe and retrieve push token

5. SDK sends the token to Xtremepush via HTTPS API

6. Xtremepush servers communicates with APNS to send an encrypted via secure connection

7. APNS delivers push message to browser

8. Browser shows a notification using OS API