We use essential cookies for the website to function, as well as analytics cookies for analyzing and creating statistics of the website performance. To agree to the use of analytics cookies, click "Accept All". You can manage your preferences at any time by clicking "Cookie Settings" on the footer. More Information.

Cookie Settings
Only Essential Cookies
Accept All
MaterialsConsole

HUAWEI HMS Core

HMS Core 4.0
输入关键字搜索
HMS Core
AppGallery Connect
HUAWEI HiAI
CTRL+K

Documents from this version have been archived, and will not continue to be maintained. Please use the latest version.

HMS Core ReferencesPush KitWeb App Client APIs (Archived)

Web App Client APIs

Last updated: 2020-03-09 12:38
Content overview
Expand

1. hms

initializeApp

Description: Initializes the object of an app integrated with HUAWEI HMS Core.

Parameters:

Options: HmsOptions

name: string (optional)

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. hms.initializeApp(hmsConfig);

2. messaging

Description: Obtains a messaging object of the WebPush agent for operations such as obtaining tokens.

Parameters: none

Return: an HmsMessaging object

Process: 1. The messaging method checks whether initialization is performed. If not, the method reports an error. 2. The method checks whether the current environment is a browser or ServiceWorker environment and whether the environment supports the API capability required by the SDK. If not, the method reports an error. 3. The method returns a ServiceWorker messaging or windows messaging object based on the environment.

2.1 getToken

Description: Obtains the token of the WebPush agent. The token can be used to send messages to the user.

Parameters: none

Return: Promise<string | null> (the value of string is a token)

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. messaging.getToken().then((currentToken) => { 
  2.     if (currentToken) { 
  3.         console.log('Current token: ', currentToken); 
  4.     } else { 
  5.         console.log('No Instance ID token available. Request permission to generate one.'); 
  6.     } 
  7. }).catch((err) => { 
  8.     console.log('An error occurred while retrieving token. ', err); 
  9. });

2.2 deleteToken

Description: Deletes a registered token to forcibly stop using the token.

Parameters: none

Return: Promise + success flag

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. messaging.getToken().then((currentToken) => { 
  2.     console.log('Current token: ', currentToken); 
  3.     return messaging.deleteToken(currentToken); 
  4. }).then((success) => { 
  5.     console.log('Delete token result: ', success); 
  6. });

2.3 usePublicVapidKey

Description: Initializes PublicVapidKey.

Parameters: publicKey (string)

Return: none

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. messaging.usePublicVapidKey("your api key");

2.4 useServiceWorker

Description: Registers a customized ServiceWorker. If no customized ServiceWorker is available, the system uses hw-messaging-sw.js in the root path to register the ServiceWorker process by default.

Parameters: registration (Set this parameter to ServiceWorkerRegistration.)

Return: none

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. navigator.serviceWorker.register("hms-messaging-sw.js", { 
  2.     scope: "./hms-cloud-messaging-push-scope" 
  3. }).then((registration) => { 
  4.     messaging.useServiceWorker(registration); 
  5. })

2.5 onMessage

Description: Transfers a message to the page of the message source and uses the callback function to process the message when receiving the message and detecting that the user is on the page of the message source.

Parameters:

nextOrObserver: NextFn | Observer,

error?: ErrorFn (reserved parameter)

completed?: CompleteFn (reserved parameter)

Return: none

Process

The ServiceWorker process receives a message and forwards it to the Windows operating system. The Windows operating system determines whether the message is sent by HUAWEI HMS Core in the background. If so, the Windows operating system calls the NextFn function by using message as the input parameter.

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. messaging.onMessage((payload) => { 
  2.     console.log('Message received. ', payload); 
  3. });

2.6 setBackgroundMessageHandler

Description: Sets a callback function, which will be used to process a message when it is found that the message received only contains data load information and the user is offline on the page of the message source.

Parameters: callback (Set this parameter to BgMessageHandler. callback is used after the ServiceWorker process receives a customized message. You can customize the native notification.)

Return: none

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. messaging.setBackgroundMessageHandler(function (payload) { 
  2.   console.log('[hms-messaging-sw.js] Received background message ', payload); 
  3.   const notificationTitle = 'Background Message Title'; 
  4.   const notificationOptions = { 
  5.     body: 'Background Message body.', 
  6.     icon: '/hms-logo.png' 
  7.   }; 
  8.   return self.registration.showNotification(notificationTitle, 
  9.     notificationOptions); 
  10. });

3. hms-messaging-sw.js

Description: Registers the ServiceWorker process by default.

Sample code:

Collapse
Word wrap
Dark theme
Copy code
  1. importScripts('https://push-static.dbankcdn.com/hms-messaging.js'); 
  2. // Your web app's hmsConfig configuration 
  3. var hmsConfig = { 
  4.   apiKey: "your apiKey", 
  5.   appId: "your appId" 
  6. }; 
  7. // Initialize hms 
  8. hms.initializeApp(hmsConfig); 
  9. const messaging = hms.messaging(); 
  10. messaging.setBackgroundMessageHandler(function (payload) { 
  11.   console.log('[hms-messaging-sw.js] Received background message ', payload); 
  12.   // Customize notification here 
  13.   const notificationTitle = 'Background Message Title'; 
  14.   const notificationOptions = { 
  15.     body: 'Background Message body.', 
  16.     icon: '/hms-logo.png' 
  17.   }; 
  18.   return self.registration.showNotification(notificationTitle, 
  19.     notificationOptions); 
  20. });


Error Codes (Archived)
Sending Messages (Archived)
This page may contain third-party content. For details, click here.
English
©2026 HUAWEI Developers. All rights reserved.
Terms of Use
Statement About HUAWEI Developers and Privacy
Cookies
Cookie Settings
Open-Source Software Notice
Search in References
Enter a keyword.