Integrate FCM
Integrate FCM (for Web)
This article is applicable for integrating Google FCM on Web.
Google FCM (Firebase Cloud Messaging) is a cross-platform messaging solution that lets you reliably deliver messages.
Before using ZIM SDK's offline push notification feature, please implement the Google FCM push notification first by referring to this document.
Prerequisites
- Platform-specific requirements:
- The Chrome browser is connected to the Web.
- Accessible HTTPS domain name or IP address.
Before the push notification implementation using FCM, make sure you complete the following:
-
Integrate the latest version of ZIM SDK. For details, see Getting Started - Integrate the SDK.
-
Integrate the ZPNs SDK. For more, refer to the Implement offline push notification.
-
Complete the Firebase-related steps below:
Go to Firebase, log in with your Google account.
Select Add project, and complete the project information.
After a project is added, go to the project detail page.
Then, click the button shown below to create a Web application.
Enter your Application's info, and click Register App.
After registering, select Service accounts > Generate new private key to generate a JSON config file.
Log in to the ZEGOCLOUD Admin Console, select Service Management > In-app Chat tab, and add FCM credentials in the Notification configuration session.
Get Web Push certificates
Select Cloud Messaging to generate the Web Push certificates.
Copy the firebaseConfig info.
Paste the copied firebaseConfig info to your project, and set up the ZPNs configurations in the project.
ZIMAppConfig appConfig = ZIMAppConfig();
appConfig.appID = 0;
appConfig.appSign = "";
ZIM.create(appConfig);
ZPNsWebConfig config = ZPNsWebConfig();
config.apiKey = "";
config.authDomain = "";
config.projectID = "";
config.storageBucket = "";
config.messagingSenderID = "";
config.appID = "";
config.measurementID = "";
// From Key pair
config.vapidKey = "";
ZPNs.getInstance().registerPush(webConfig: config);
Navigate to SDK downloads to get the latest version of the ZPNs SDK.
In a Flutter project, you only need to copy the firebase-messaging-sw.js file to the root directory of the web build, in the same directory as the index.html file. There is no need to import it.
Contact ZEGOCLOUD technical support for further configuration after you have completed the steps mentioned above.
After completing the above steps, you can proceed to complete Implement offline push notification.