WebPush Example

The following page shows how the WebPush library works.

First you need to create your own WebPush class which extends the WebPushClass class.
The new class should be created in a seperate file in your projects directory available to HTTP-requests!
Each project should preferrably have their own file so that you can seperatly broadcast between them.

The code would look like this (let's call this file webpush.php):

<?php
    // Include the library
    require 'path_to_library_folder/.webpushclass.php';
    
    // Extend the class
    class WebPush extends WebPushClass {
        private function subscribeCallback(int $id) : void {
            // Your code to save the subscription ID to a specific user
            // Keep in mind that a user could subscribe with multiple devices!
        }
        
        private function unsubscribeCallback(int $id) : void {
            // Your code to remove the subscription ID from a specific user
        }
    }
    
    // Create a new instance of the class
    // This is needed for the subscription and desubscription to work!
    $webPush = new WebPush();
?>

Now wherever you need to send a notification, you can use the function sendNotification(int $id, string $title, array $options) : bool.
This function returns TRUE if all notifications were sent successfully (this doesnt mean that they were received successfully!) or FALSE if one or more notifications failed.

The code would look like this:

<?php
    // Include your class
    require 'path_to_project_folder/webpush.php';
    
    /*
        Send a notification:
        
        1st param:  NULL to notify everyone OR
                    an ID saved in the subscribeCallback
        2nd param:  The title of the notification                   (https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification#title)
        3rd param:  The options of the notification                 (https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification#options)
    */
    $webPush->sendNotification($subscriptionID, "Example Title", [ "body" => "Hello World!" ]);
?>

Now we get to the last smaller last steps:

1. SSL (https) needs to be used for notifications to work!
2. A valid Web application manifest is needed for your project!
   Use this as a reference: https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Manifest
3. Download and copy the files webpush.js and sw.js into the same folder where your file webpush.php is!

Lastly, in JavaScript, you can call the function subscribeWebPush().
This function automatically asks for permission to send notifications if not yet given and calls the PHP-callback subscribeCallback if the user subscribed.

To unsubscribe a user, you can call the function unsubscribeWebPush().
This doesn't revoke notification permissions (this makes re-subscribing easier for the user), but calls the PHP-callback unsubscribeCallback for you to remove the subscription-ID from the user.