Flutter框架下实现点击URL链接跳转APP而非浏览器的相关问题
实现思路
该需求本质是为你的App配置 App Links(安卓平台) / Universal Links(iOS平台) 能力,让系统将你的网站域名和App做绑定,用户点击对应域名的URL时优先唤起App,而非跳转浏览器加载网页。
具体实现步骤
1. 安卓端配置(App Links)
- 打开
android/app/src/main/AndroidManifest.xml文件,在启动Activity标签内添加如下Intent Filter:
<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" /> <!-- 配置支持http和https协议 --> <data android:scheme="http" /> <data android:scheme="https" /> <!-- 替换为你的网站域名 --> <data android:host="your-domain.com" /> <!-- 可选:配置匹配的路径前缀,比如只匹配/product开头的路径 --> <data android:pathPrefix="/product" /> </intent-filter>
- 在你的网站服务器根目录下创建
.well-known/assetlinks.json文件,填入你的应用包名、签名信息,用于安卓系统验证域名所有权,安卓12及以上版本必须完成该验证才能自动唤起App。
2. iOS端配置(Universal Links)
- 用Xcode打开iOS工程,进入
Signing & Capabilities标签页,添加Associated Domains能力,新增域名配置,格式为applinks:your-domain.com,将your-domain.com替换为你的实际网站域名。 - 在你的网站服务器根目录下创建
.well-known/apple-app-site-association文件,填入你的苹果开发者Team ID、应用Bundle ID以及路径匹配规则,用于iOS系统验证域名所有权。
3. Flutter端处理链接唤起逻辑
如果需要在App被唤起后,根据链接的路径、参数跳转到指定页面,可以使用uni_links库实现监听和解析:
- 首先在
pubspec.yaml中添加依赖:
dependencies: uni_links: ^0.5.1 # 替换为当前最新稳定版本
- 在App初始化位置添加链接监听逻辑,示例代码如下:
import 'package:uni_links/uni_links.dart'; import 'package:flutter/services.dart'; Future<void> initDeepLink() async { // 处理App冷启动时被链接唤起的场景 try { final initialLink = await getInitialLink(); if (initialLink != null) { parseAndNavigate(initialLink); } } on PlatformException { // 异常捕获处理 } // 处理App在后台运行时被链接唤起的场景 linkStream.listen((String? link) { if (link != null) { parseAndNavigate(link); } }, onError: (e) { // 异常捕获处理 }); } void parseAndNavigate(String link) { Uri uri = Uri.parse(link); // 自定义解析逻辑,比如匹配路径、获取参数后跳转对应页面 if (uri.path == '/product/detail') { String productId = uri.queryParameters['id'] ?? ''; // 执行跳转到商品详情页的逻辑 } }
注意事项
- 两个平台的域名验证文件必须放在网站根目录的
.well-known路径下,且允许公网直接访问,不能配置301/302跳转 - 安卓端的
assetlinks.json文件内的签名信息要和你App打包使用的签名完全匹配,测试时注意区分debug签名和release签名 - 如果你需要兼容自定义scheme格式的链接(比如
myapp://开头的链接),可以额外在原生配置中添加自定义scheme的匹配规则
内容的提问来源于stack exchange,提问作者Alex Maina
相关产品推荐
相关产品推荐

