Step 1: Configuration Firebase and Service Worker

Prev Next

Web Push at Mapp is based on Firebase.

The Service Worker is necessary to display messages when the browser or a tab are not in focus.

  1. Download the JavaScript file firebase-messaging-sw.js.

  2. Create the Webapp-Project in Firebase and copy the configuration.

  3. In the JavaScript file make the following adjustments by pasting the configuration:
    Example

    /* ... */
    
    const firebaseConfig = {
    	apiKey: "<<Firebase apiKey>>",
    	authDomain: "<<Firebase authDomain>>",
    	projectId: "<<Firebase projectId>>",
    	storageBucket: "<<Firebase storageBucket>>",
    	messagingSenderId: "<<Firebase messagingSenderId>>",
    	appId: "<<Firebase appId>>",
    	measurementId: "<<Firebase measurementId>>" // Optional
    };
    
    /* ... */

    Parameter

    Description

    apiKey

    Please include as specified in your Firebase console in project settings > general > my app > configuration.

    authDomain

    projectId

    storageBucket

    messagingSenderId

    appId

    measurementId

    (Optional) Include only if you use Google Analytics in your Firebase setup.

    Watch the following video for more details:

  4. Include the script file "firebase-messaging-sw.js" in your server.