Flutter中如何使用app_links处理深度链接

在Flutter项目中集成app_links插件处理深度链接时遇到问题：

  1. 按照官方文档配置AndroidManifest.xml和Info.plist后，在Android和iOS上测试链接跳转均无效
  2. 使用Universal Links时，iOS端能正常唤醒App但无法获取到链接参数
  3. 调试时发现onAppLink方法没有被触发，不确定是否与路由配置有关
    请问正确的实现流程是什么？如何排查上述问题？是否需要额外处理冷启动和热启动不同场景？
2 回复

在Flutter中使用app_links处理深度链接：

  1. 添加依赖：pubspec.yaml中添加app_links包。
  2. 配置Android和iOS的URL Scheme和App Links/Universal Links。
  3. 在代码中初始化并监听链接：
final appLink = AppLink();
String? link = await appLink.getInitialAppLink();
appLink.uriLinkStream.listen((uri) {
  // 处理链接
});
  1. 根据URI进行页面导航。

更多关于Flutter中如何使用app_links处理深度链接的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中，使用app_links包处理深度链接（Deep Linking）的步骤如下：

1. 添加依赖

在pubspec.yaml中添加依赖：

dependencies:
  app_links: ^5.0.1

2. 配置平台设置

Android：

  • 在android/app/src/main/AndroidManifest.xml中，在<activity>标签内添加：
<intent-filter android:autoVerify="true">
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="https" android:host="yourdomain.com" />
  <!-- 可选：添加其他方案如 http、自定义方案 -->
</intent-filter>

iOS：

  • 在ios/Runner/Info.plist中添加：
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Editor</string>
    <key>CFBundleURLName</key>
    <string>yourdomain.com</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>https</string>
      <!-- 可选：添加自定义方案 -->
    </array>
  </dict>
</array>

3. 在Flutter代码中使用

import 'package:app_links/app_links.dart';

class DeepLinkHandler {
  late AppLinks _appLinks;
  StreamSubscription<Uri>? _linkSubscription;

  void initDeepLinks() {
    _appLinks = AppLinks();

    // 监听应用启动时的初始链接
    _appLinks.getInitialAppLink().then((uri) {
      if (uri != null) handleDeepLink(uri);
    });

    // 监听应用运行期间的链接
    _linkSubscription = _appLinks.uriLinkStream.listen((uri) {
      handleDeepLink(uri);
    });
  }

  void handleDeepLink(Uri uri) {
    // 解析URI并导航到对应页面
    print('收到深度链接: $uri');
    
    if (uri.pathSegments.contains('product') && uri.pathSegments.length > 1) {
      String productId = uri.pathSegments[1];
      // 导航到商品详情页
      Navigator.pushNamed(context, '/product/$productId');
    }
  }

  void dispose() {
    _linkSubscription?.cancel();
  }
}

4. 在应用初始化时调用

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final DeepLinkHandler _deepLinkHandler = DeepLinkHandler();

  @override
  void initState() {
    super.initState();
    _deepLinkHandler.initDeepLinks();
  }

  @override
  void dispose() {
    _deepLinkHandler.dispose();
    super.dispose();
  }
}

关键点说明：

  • 初始链接：处理应用通过链接启动时的场景
  • 流监听：处理应用已运行时收到链接的场景
  • URI解析：根据路径和参数决定导航逻辑
  • 自定义方案：支持yourapp://格式的链接

通过以上配置，应用即可响应深度链接并执行相应导航操作。

回到顶部