跳到主内容

为 iOS 设置通用链接

了解如何为使用 Flutter 构建的 iOS 应用设置通用链接。

深度链接 (Deep linking) 允许应用用户通过 URI 启动应用。此 URI 包含方案 (scheme)、主机 (host) 和路径 (path),并将应用打开至特定屏幕。

通用链接 (Universal link) 是一种 iOS 设备专有的深度链接,仅使用 httphttps 协议。

要设置通用链接,您需要拥有一个网站域名。作为临时解决方案,可以考虑使用 Firebase HostingGitHub Pages

设置好深度链接后,您可以对其进行验证。要了解更多信息,请参阅 验证深度链接

创建或修改 Flutter 应用

#

编写一个能够处理传入 URL 的 Flutter 应用。

此示例使用 go_router 软件包来处理路由。Flutter 团队维护着 go_router 软件包。它提供了一个简单的 API 来处理复杂的路由场景。

  1. 要创建新应用,请输入 flutter create <app-name>

    flutter create deeplink_cookbook
    
  2. 要将 go_router 软件包添加为依赖项,请运行 flutter pub add

    flutter pub add go_router
    
  3. 要处理路由,请在 main.dart 文件中创建一个 GoRouter 对象

    main.dart
    dart
    import 'package:flutter/material.dart';
    import 'package:go_router/go_router.dart';
    
    void main() => runApp(MaterialApp.router(routerConfig: router));
    
    /// This handles '/' and '/details'.
    final router = GoRouter(
      routes: [
        GoRoute(
          path: '/',
          builder: (_, _) => Scaffold(
            appBar: AppBar(title: const Text('Home Screen')),
          ),
          routes: [
            GoRoute(
              path: 'details',
              builder: (_, _) => Scaffold(
                appBar: AppBar(title: const Text('Details Screen')),
              ),
            ),
          ],
        ),
      ],
    );
    

调整 iOS 构建设置

#
  1. 启动 Xcode。

  2. 在 Flutter 项目的 ios 文件夹中打开 ios/Runner.xcworkspace 文件。

添加关联域 (Associated Domains)

#
  1. 如有必要,启动 Xcode。

  2. 点击顶部的 Runner

  3. 在编辑器中,点击 Runner target。

  4. 点击 Signing & Capabilities

  5. 要添加新域,请在 Signing & Capabilities 下点击 + Capability

  6. 点击 Associated Domains

    Xcode associated domains screenshot

  7. Associated Domains 部分,点击 +

  8. 输入 applinks:<web domain>。将 <web domain> 替换为您的域名。

    Xcode add associated domains screenshot

  1. 在您的编辑器中打开 ios/Runner/Runner.entitlements XML 文件。

  2. <dict> 标签内添加关联域。

    xml
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
    <plist version="1.0">
    <dict>
      <key>com.apple.developer.associated-domains</key>
      <array>
        <string>applinks:example.com</string>
      </array>
    </dict>
    </plist>
    
  3. 保存 ios/Runner/Runner.entitlements 文件。

要检查您创建的关联域是否可用,请执行以下步骤

  1. 如有必要,启动 Xcode。

  2. 点击顶部的 Runner

  3. 在编辑器中,点击 Runner target。

  4. 点击 Signing & Capabilities。这些域应该会出现在 Associated Domains 部分中。

    Xcode add associated domains screenshot

您已完成应用的深度链接配置。

将应用与您的网站域名关联

#

您需要在网站域名下托管一个 apple-app-site-association 文件。该文件告诉移动浏览器打开哪个 iOS 应用,而不是使用浏览器。要创建此文件,请查找您在上一步中创建的 Flutter 应用的 appID

定位 appID 的组成部分

#

Apple 将 appID 格式化为 <team id>.<bundle id>

  • 在 Xcode 项目中找到 Bundle ID。
  • 开发者账号 中找到 Team ID。

例如:假设 Team ID 为 S8QB4VV633,Bundle ID 为 com.example.deeplinkCookbook,那么您输入的 appID 应为 S8QB4VV633.com.example.deeplinkCookbook

创建并托管 apple-app-site-association JSON 文件

#

此文件使用 JSON 格式。保存文件时,请勿包含 .json 文件扩展名。根据 Apple 文档,此文件应类似于以下内容

json
{
  "applinks": {
    "apps": [],
    "details": [
      {
        "appIDs": [
          "S8QB4VV633.com.example.deeplinkCookbook"
        ],
        "paths": [
          "*"
        ],
        "components": [
          {
            "/": "/*"
          }
        ]
      }
    ]
  },
  "webcredentials": {
    "apps": [
      "S8QB4VV633.com.example.deeplinkCookbook"
    ]
  }
}
  1. appIDs 数组中的一个值设置为 <team id>.<bundle id>

  2. paths 数组设置为 ["*"]paths 数组指定了允许的通用链接。使用星号 * 会将所有路径重定向到 Flutter 应用。如果需要,可以将 paths 数组的值更改为更适合您应用的设置。

  3. 将文件托管在类似于以下结构的 URL 中。

    <webdomain>/.well-known/apple-app-site-association

  4. 验证您的浏览器是否可以访问此文件。

#

使用物理 iOS 设备或模拟器测试通用链接。

  1. 在测试之前,请在 iOS 设备或模拟器上安装 Flutter 应用,在目标设备上使用 flutter run

    Simulator screenshot

    完成后,Flutter 应用会显示在 iOS 设备或模拟器的主屏幕上。

  2. 如果您使用模拟器进行测试,请使用 Xcode CLI

    xcrun simctl openurl booted https://<web domain>/details
    
  3. 如果您使用物理 iOS 设备进行测试

    1. 启动 备忘录 (Note) 应用。
    2. 备忘录 应用中输入 URL。
    3. 点击生成的链接。

    如果成功,Flutter 应用将启动并显示其详情页面。

    Deeplinked Simulator screenshot

查找源代码

#

您可以在 GitHub 仓库中找到 deeplink_cookbook 示例的源代码。