如何在Ionic 5（Cordova）安卓项目中生成自定义URL Scheme

1. 安装自定义URL Scheme插件 #

首先通过Cordova CLI安装官方推荐的插件，执行以下命令：

cordova plugin add cordova-plugin-customurlscheme --variable URL_SCHEME=yourapp

把yourapp替换成你的专属Scheme名称（比如myapp），之后唤起应用的链接格式就是yourapp://xxx。

2. 确认AndroidManifest.xml配置（插件自动完成，可选检查） #

插件会自动在AndroidManifest.xml的主Activity中添加对应的，示例如下：

<intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="yourapp" />
</intent-filter>

如果需要更精准的跳转控制（比如指定host），可以手动添加android:host属性，比如：

<data android:scheme="yourapp" android:host="pages" />

此时唤起链接就变成yourapp://pages/detail。

3. 在Ionic应用中处理跳转逻辑 #

在应用入口（比如app.component.ts）中，监听应用被URL唤起的事件，并解析参数跳转指定页面：

import { Component } from '@angular/core';
import { Platform, Router } from '@ionic/angular';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
})
export class AppComponent {
  constructor(private platform: Platform, private router: Router) {
    this.initializeApp();
  }

  initializeApp() {
    this.platform.ready().then(() => {
      // 处理URL唤起事件
      if ((window as any).handleOpenURL) {
        (window as any).handleOpenURL((url: string) => {
          // 用setTimeout确保应用完全初始化后再跳转
          setTimeout(() => {
            this.parseAndNavigate(url);
          }, 0);
        });
      }
    });
  }

  private parseAndNavigate(url: string) {
    // 解析URL示例：yourapp://pages/detail?id=123
    const urlParts = url.split('://');
    if (urlParts.length < 2) return;

    const pathAndParams = urlParts[1];
    const [path, paramString] = pathAndParams.split('?');
    const pathSegments = path.split('/'); // 得到['pages', 'detail']

    // 解析查询参数
    const params = new URLSearchParams(paramString);
    const itemId = params.get('id'); // 得到'123'

    // 根据解析结果跳转对应页面
    switch (pathSegments[1]) {
      case 'detail':
        this.router.navigate([`/detail/${itemId}`]);
        break;
      case 'profile':
        this.router.navigate([`/user-profile/${params.get('userId')}`]);
        break;
      // 其他页面逻辑
      default:
        this.router.navigate(['/home']);
    }
  }
}

注意：如果你的Ionic版本使用NavController而非Router，替换成this.navCtrl.navigateForward(...)即可。

4. Android 12+ 额外配置 #

针对Android 12及以上系统，需要在AndroidManifest.xml的<manifest>标签内添加<queries>声明，确保系统允许应用被外部URL唤起：

<queries>
    <intent>
        <action android:name="android.intent.action.VIEW" />
        <data android:scheme="yourapp" />
    </intent>
</queries>

5. 测试方法 #

• 在真机浏览器地址栏输入yourapp://pages/detail?id=123，直接唤起应用并跳转
• 在网页中添加链接：<a href="yourapp://pages/detail?id=123">打开详情页</a>，点击即可唤起
• 如果需要处理应用未安装的情况，可以在网页中通过JS判断唤起是否失败，再引导用户跳转应用商店（比如通过setTimeout检测页面是否还在网页中）

注意事项 #

• Scheme名称尽量唯一，避免和其他应用冲突
• 测试必须用真机，部分模拟器可能无法正确处理URL唤起
• 确保应用打包时插件已正确集成，可通过cordova plugin list查看插件是否存在

内容的提问来源于stack exchange，提问作者Deepak Mandal