These docs are for v1.0. Click to read the latest docs for v2.0.

FCM Configuration

The steps you need to follow to register with Firebase Cloud Messenger are explained below:

Create a new project

To create a project, perform the following steps:

  1. Sign into Firebase console using your Gmail ID.
1366
  1. Click Add Project, enter the project name , click on continue
948
  1. Click on Continue in Step 2
919
  1. In Step 3, select default account and click on Create Project
928
  1. Click on Continue
968
  1. Add Firebase to your web app & click on Web
957
  1. Enter web app name ,click on Register app
771
  1. In Step 2, you will get API key and sender id. Click on Continue to console
850 921
  1. Click on Project setting under Project Overview, to get the Auth key
996
  1. Click Cloud Messaging to get your Server key [It is Authorization Key for Smartech] as highlighted in the screenshot below
1286
  1. Once the above details are with you, you can go back to the Integration Guide or Smartech platform to continue with your Integration.

📘

Once the above details are with you, you can go back Smartech Platform to continue with your Integration. Click here for following the steps of the same.

ADD sw.js File

Once FCM credentials have been added and saved, Smartech panel generates sw.js (Service worker JS) which needs to be added in the root directory of your website.

How to get Sw.js file:

To get the sw.js file, PFB, The path
Go to your Smartech Platform --> Assets --> Web --> Websites --> Get JavaScript SDK --> Download Zip

595

Once Zip file is downloaded, rename the file to sw.js and put the same in the Root directory of your website.

Once the above steps are complete, you are ready to go LIVE for Browser notification on Firefox and Chrome.

Validating sw.js Integration

Verifying Service Worker

Once you copy-paste the codes as shown in the previous step and also added the service worker file to your website root, follow these simple steps to verify the process of integration:

  1. Open your website in Chrome browser and open Developer Tools from the browser menu or by pressing keyboard shortcut key F12.
  2. A panel (Dev Tools) will appear in your browser window.
  3. Under this Dev Tools panel, switch to ‘Application’ tab and click on Service Worker from the list of Applications available on the left.
  4. Above step shows sw.js as a source here.
1024 1024

Right-click on sw.js and click on ‘Open in New Tab’. This will open the service worker file in a new tab showing the code with-in it.

820 1024

📘

  1. Once done with the above steps, if you want, you can now head over to the Web Push Section, to get started with running Web Push Messages.

  2. In case of any queries, please contact [email protected]