鸿蒙点击跳转小程序

当前文档实现当用户点击推送的通知栏后,跳转到小程序页面,并且可以设置打开小程序的参数配置。

前提条件

  • 客户端版本 >= 10.2.3.13

  • 服务端版本

    • 公有云:version >= 1.21.11

    • 私有云:version >= 1.37.0

方案设计

通过配置和打开可以路由到小程序页面的 Ability 实现打开小程序的目的。在推送消息时,可以在消息的扩展参数(harmonyRouteUrl)中配置特定的小程序路由 Ability。所有需要打开小程序的推送均可以通过该 Ability 中转。另外,您还可以传入跳转的页面 URL 来实现跳转到特定的小程序页面(可以不传入参数)。如果您在扩展参数中填入路由的 Ability 页面,则会覆盖消息模板中的跳转地址;如果不填,则跳转至模板中的页面地址。

使用说明

客户端配置

在客户端配置中打开小程序的页面,如下方代码中的 PushLandingAbility 所示。

import UIAbility from '@ohos.app.ability.UIAbility';
import Want from '@ohos.app.ability.Want';
import AbilityConstant from '@ohos.app.ability.AbilityConstant';
import window from '@ohos.window';
import hilog from '@ohos.hilog';
import { MpaasPushServiceImpl, MPPushMsg, msgOutput, PushMsgHandler } from '@mpaas/push';
import pushService from '@hms.core.push.pushService';
import { BusinessError } from '@ohos.base';
import { HRiverMini } from '@mpaas/hrivermini';

export class PushLandingAbility extends UIAbility {
  private static  TAG: string = "PushLandingAbility"

  private pushData: object = JSON.parse("{}");
  private pushKey: string = "";
  public  para: Record<string,string> = { 'msg_id': "default", 'msg_data': "default", 'page_route':"default"};
  public storageData: LocalStorage = new LocalStorage(this.para);
  landingWindowStage: window.WindowStage | undefined = undefined;

  async onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): Promise<void> {
    // MPFramework.create(this.context)
    hilog.info(0x0000, PushLandingAbility.TAG, 'PushLandingAbility create. Data: %{public}s', JSON.stringify(want.parameters) ?? '');
    let k: string = ""
    let v: object = JSON.parse("{}")
    let msg: msgOutput | undefined = PushMsgHandler.parsePushMsg(want)
    let msg_id: string | undefined = msg?.msg_id
    let msg_data: MPPushMsg | undefined = msg?.msg_data

    if (msg) {
      if (msg_id) {
        k = msg_id
        hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate k: %{public}s', k);
      } else {
        hilog.warn(0x0000, PushLandingAbility.TAG, 'msg_id is undefined');
      }
      if (msg_data) {
        v = msg_data
        hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate v: %{public}s', v);
      } else {
        hilog.warn(0x0000, PushLandingAbility.TAG, 'msg_data is undefined');
      }
    } else {
      hilog.warn(0x0000, PushLandingAbility.TAG, 'msg is undefined');
    }

    let pageRoute: string | undefined = this.getOpenH5Url(want.parameters)
    hilog.info(0x0000, PushLandingAbility.TAG, 'pageRoute='+pageRoute);
      
    this.storageData.set('msg_id', k)
    this.storageData.set('msg_data', JSON.stringify(v))
    this.storageData.set('page_route', pageRoute as string)
    hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate push_msgkey: %{public}s', k);
    hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate push_msgdata: %{public}s', JSON.stringify(v));
    hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate page_route: %{public}s', this.storageData.get("page_route"));
  }

  async onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): Promise<void> {
    hilog.info(0x0000, PushLandingAbility.TAG, 'PushLandingAbility onNewWant. Data: %{public}s', JSON.stringify(want.parameters) ?? '');
    let k: string = ""
    let v: object = JSON.parse("{}")

    let msg: msgOutput | undefined = PushMsgHandler.parsePushMsg(want)
    let msg_id: string | undefined = msg?.msg_id
    let msg_data: MPPushMsg | undefined = msg?.msg_data

    if (msg) {
      if (msg_id) {
        k = msg_id
        hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate k: %{public}s', k);
      } else {
        hilog.warn(0x0000, PushLandingAbility.TAG, 'msg_id is undefined');
      }
      if (msg_data) {
        v = msg_data
        hilog.info(0x0000, PushLandingAbility.TAG, 'onCreate v: %{public}s', k);
      } else {
        hilog.warn(0x0000, PushLandingAbility.TAG, 'msg_data is undefined');
      }
    } else {
      hilog.warn(0x0000, PushLandingAbility.TAG, 'msg is undefined');
    }

    let pageRoute: string | undefined = this.getOpenH5Url(want.parameters)
    hilog.info(0x0000, PushLandingAbility.TAG, 'pageRoute='+pageRoute);

    this.storageData.set('msg_id', k)
    this.storageData.set('msg_data', JSON.stringify(v))
    this.storageData.set('page_route', pageRoute as string)

    hilog.info(0x0000, PushLandingAbility.TAG, 'onNewWant push_msgkey: %{public}s', this.storageData.get("msg_id"));
    hilog.info(0x0000, PushLandingAbility.TAG, 'onNewWant push_msgdata: %{public}s', JSON.stringify(this.storageData.get("msg_data")));
    hilog.info(0x0000, PushLandingAbility.TAG, 'onNewWant page_route: %{public}s', this.storageData.get("page_route"));

    if (this.landingWindowStage != null) {
      hilog.info(0x0000, PushLandingAbility.TAG, 'start landingWindowStage.loadContent');
      await this.landingWindowStage.loadContent('pushpages/pushLandingPage', this.storageData)
    }
  }

  onDestroy(): void {
    hilog.info(0x0000, PushLandingAbility.TAG, '%{public}s', 'Ability onDestroy');
  }

  async onWindowStageCreate(windowStage: window.WindowStage): Promise<void> {
    // Main window is created, set main page for this ability
    // 创建新实例并使用给定对象初始化
    this.landingWindowStage = windowStage
    hilog.info(0x0000, PushLandingAbility.TAG, 'this.pushKey= %{public}s',this.storageData.get("msg_id"));
    hilog.info(0x0000, PushLandingAbility.TAG, 'this.pushData= %{public}s',this.storageData.get("msg_data"));
    try {
      hilog.info(0x0000, PushLandingAbility.TAG, 'this.storageData. Key: %{public}s, this.storageData Data: %{public}s',this.storageData.get("msg_id"), this.storageData.get("msg_data"));
      await windowStage.loadContent('pushpages/pushLandingPage', this.storageData)
      hilog.info(0x0000, PushLandingAbility.TAG, 'Succeeded in loading the content. Key: %{public}s, Data: %{public}s',this.storageData.get("msg_id"), JSON.stringify(this.storageData.get("msg_data")) ?? '');
    } catch (e) {
      console.log("err msg="+e.message)
      return
    }
  }

  private getOpenH5Url(data?: object): string | undefined {
    hilog.info(0x0000, PushLandingAbility.TAG, 'data='+data);
    if(data && data["com_harmony_push"] && data["com_harmony_push"]["bData"]) {
      return data["com_harmony_push"]["bData"]["openH5Url"]
    }
    return undefined
  }
}

界面示例代码参考如下:

import { common } from '@kit.AbilityKit';
import { HRiverMini, AppPage } from '@mpaas/hrivermini';
import { hilog } from '@kit.PerformanceAnalysisKit';

const TAG: string = "PushLandingPage"

let store2 = LocalStorage.getShared()

@Entry(store2)
@Component
struct pushLandingPage {

  @LocalStorageLink('msg_id') msgKey: string = "default";
  @LocalStorageLink('msg_data') msgData: string = "default";
  @LocalStorageLink('page_route') pageRoute: string = "default";

  @State msg: string = 'Landing Page';
  @State msgKeyStat: string = 'received msg_id = ' + `${this.msgKey}`;
  @State pageRouteStat: string = 'received page_route = ' + `${this.pageRoute}`;
    
  private context = getContext(this) as common.UIAbilityContext;

  pageInfos: NavPathStack = new NavPathStack()

  @Builder
  PageMap(name: string, navPageIntent: Map<string, Object>) {
    AppPage(name, navPageIntent);
  }

  onPageShow(){
    HRiverMini.notifyNavigationCreate(this.context, this.pageInfos)
  }

  aboutToAppear() {
    let startParams = new Map<string, Object>() // 启动参数
    startParams.set("page", this.pageRoute as string);
    HRiverMini.startApp("2024052820240528", startParams)
  }

  build() {
    Navigation(this.pageInfos){
      Row() {
        Column({space:20}) {
          Text(this.msg)
            .fontSize(15)
            .fontWeight(FontWeight.Bold)

          Text(this.msgKeyStat)
            .fontSize(15)
            .fontWeight(FontWeight.Bold)

          Text(this.msgDataStat)
            .fontSize(15)
            .fontWeight(FontWeight.Bold)

        }
        .width('100%')
      }
    }.navDestination(this.PageMap);

  }
}

服务端配置

您需要添加如下两个扩展参数。

参数名称

说明

harmonyRouteUrl

鸿蒙中转路由 Ability。若没有传递该扩展参数,则取接口参数或模板中的 URL 值。

openH5Url

鸿蒙 H5 路由地址。