Click on the message notification to jump to the application page

Source: Dev.to

Problem description

How to add behavioral intent to notifications and redirect to the specified page of the application when sending messages using Notification Kit?

Background knowledge

When publishing a notification, if you expect users to pull up the target application component or publish a public event by clicking the notification bar, you can apply for WantAgent through Ability Kit to encapsulate it in the notification message.
See the documentation:

Solution

1. Apply for notification permission in the code

   enableNotifications() {
     const requestEnableNotificationCallback = (err: BusinessError): void => {
       if (err) {
         hilog.error(0x0000, 'testTag',
           `[ANS] requestEnableNotification failed, code is ${err.code}, message is ${err.message}`);
       } else {
         hilog.info(0x0000, 'testTag', `[ANS] requestEnableNotification success`);
       }
     };
     notificationManager.requestEnableNotification(this.context, requestEnableNotificationCallback);
   }

2. Create WantAgentInfo and publish a notification

   Button('click').onClick(() => {
     let wantAgentObj: WantAgent;
     const wantAgentInfo: wantAgent.WantAgentInfo = {
       wants: [
         {
           deviceId: '',
           bundleName: 'com.example.ir_wantagent',
           abilityName: 'EntryAbility',
           action: '',
           entities: [],
           uri: '',
           parameters: {
             targetPage: 'Index2' // Add target page parameters
           }
         }
       ],
       actionType: wantAgent.OperationType.START_ABILITY,
       requestCode: 0,
       wantAgentFlags: [wantAgent.WantAgentFlags.CONSTANT_FLAG]
     };
     wantAgent.getWantAgent(wantAgentInfo, (err: BusinessError, data: WantAgent) => {
       if (err) {
         hilog.error(DOMAIN_NUMBER, TAG,
           `Failed to get want agent. Code is ${err.code}, message is ${err.message}`);
         return;
       }
       hilog.info(DOMAIN_NUMBER, TAG, 'Succeeded in getting want agent.');
       wantAgentObj = data;
   
       const notificationRequest: notificationManager.NotificationRequest = {
         content: {
           notificationContentType: notificationManager.ContentType.NOTIFICATION_CONTENT_BASIC_TEXT,
           normal: {
             title: 'Test_Title',
             text: 'Test_Text',
             additionalText: 'Test_AdditionalText',
           },
         },
         id: 6,
         label: 'TEST',
         wantAgent: wantAgentObj,
       };
       notificationManager.publish(notificationRequest, (err: BusinessError) => {
         if (err) {
           hilog.error(DOMAIN_NUMBER, TAG,
             `Failed to publish notification. Code is ${err.code}, message is ${err.message}`);
           return;
         }
         hilog.info(DOMAIN_NUMBER, TAG, 'Succeeded in publishing notification.');
       });
     });
   });

3. Handle the intent in EntryAbility.ets

   Hot start – when the application is already running:

   // Hot start
   onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void {
     const targetPage = want.parameters?.targetPage;
     console.info(`onNewWant Received parameter: ${targetPage}`);
     if (targetPage === 'Index2') {
       router.pushUrl({ url: 'pages/Index2' });
     }
   }

   Cold start – when the application is not running:

   onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {
     this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET);
     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
     this.funcAbilityWant = want;
   }
   
   onWindowStageCreate(windowStage: window.WindowStage): void {
     let url = 'pages/Index';
     if (this.funcAbilityWant?.parameters?.targetPage === 'Index2') {
       url = 'pages/Index2'; // New page to navigate to
     }
     console.info(`url:${url}`);
     windowStage.loadContent(url, (err) => {
       if (err.code) {
         hilog.error(0x0000, 'testTag',
           'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
         return;
       }
       hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.');
     });
   }

4. Add a new Index2 page

   Right‑click the Pages folder → New → Page → New Page, name it Index2, which creates Index2.ets.

5. Simulate clicking a message to jump to the page

   Cold start: Send the notification, terminate the app from the multitasking view, then click the notification – the app launches directly to Index2.

   Hot start: Send the notification, send the app to the background, then click the notification – the running app navigates to Index2.

Complete example – Index.ets

import { common, wantAgent, WantAgent } from '@kit.AbilityKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { notificationManager } from '@kit.NotificationKit';

const TAG = '[PublishOperation]';
const DOMAIN_NUMBER = 0xFF00;

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';
  private context = getContext(this) as common.UIAbilityContext;

  enableNotifications() {
    const requestEnableNotificationCallback = (err: BusinessError): void => {
      if (err) {
        hilog.error(0x0000, 'testTag',
          `[ANS] requestEnableNotification failed, code is ${err.code}, message is ${err.message}`);
      } else {
        hilog.info(0x0000, 'testTag', `[ANS] requestEnableNotification success`);
      }
    };
    notificationManager.requestEnableNotification(this.context, requestEnableNotificationCallback);
  }

  // ... (rest of the component logic, including the button click shown in step 2)
}

For the full original discussion, see: