【HarmonyOS NEXT】鸿蒙三方应用跳转到系统浏览器

【HarmonyOS NEXT】鸿蒙三方应用跳转到系统浏览器

一、前言：

从三方应用跳转到系统浏览器是比较常见的功能。

拓展应用功能边界： 三方应用的功能通常相对聚焦和特定，无法涵盖用户可能需要的所有网络浏览需求。跳转到系统浏览器能让用户访问更广泛的网页内容，弥补三方应用自身功能的局限性，如在购物应用中点击外部链接查看商品评测、在阅读应用中打开链接获取更多背景知识等。

适配不同应用场景： 不同的应用场景对浏览体验有不同要求。有些场景下，用户需要在应用内进行深度交互，而在另一些场景下，可能更需要系统浏览器提供的通用、全面的浏览功能，如全屏浏览、多标签页管理等。

提高信息获取效率： 当三方应用内的信息展示受限时，跳转到系统浏览器可以让用户更方便地进行信息搜索和比较。例如在旅游应用中查看酒店信息时，用户可跳转到浏览器对比不同平台的价格和评价。

满足安全合规需求： 部分三方应用涉及金融交易、隐私数据等敏感操作，跳转到系统浏览器可以利用系统浏览器的安全机制和防护功能，确保用户信息安全，满足相关安全合规要求。

二、方案实现：

方案一：

import { common } from '@kit.AbilityKit';
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct SysWebTestPage {

  private TAG: string = "SysWebTestPage";

  private onClickJumpWeb = () => {
    const context = getContext(this) as common.UIAbilityContext;
    context.openLink('https://www.qq.com', { appLinkingOnly: false })
      .then(() => {
        console.info(this.TAG, 'jump success.');
      })
      .catch((error: BusinessError) => {
        console.error(this.TAG, "jump failed. error:" + JSON.stringify(error));
      });
  }

  build() {
    Column() {
      Button("点击跳转系统浏览器").onClick(this.onClickJumpWeb)
    }
    .width("100%")
    .height("100%")
    .justifyContent(FlexAlign.Center)
  }

}

方案二：

  /**
   * 拉起系统浏览器
   * @param url 要打开的网页地址
   * @returns 返回一个Promise，该Promise解析为void
   */
  static async toWebBrowser(url: string): Promise<void> {
    // 获取当前应用的UIAbility上下文
    let context = AppUtil.getContext();
    // 创建一个Want对象，用于描述启动系统浏览器的意图
    let want: Want = {
      // 指定动作类型，这里使用的是查看数据的动作
      action: 'ohos.want.action.viewData',
      // 指定实体类型，这里表示可浏览的实体
      entities: ['entity.system.browsable'],
      // 设置要打开的网页地址
      uri: url,
      // 设置额外的参数，这里包含了拉起方应用的包名
      parameters: {
        // 应用包名，用于标识拉起方应用
        bundleName: context.abilityInfo.bundleName,
        // 传递给浏览器的参数，这里同样使用了应用包名
        pushParams: context.abilityInfo.bundleName,
      }
    };
    // 使用UIAbility上下文启动系统浏览器，传入之前创建的Want对象
    return await context.startAbility(want);
  }