本功能基于flutter平台实现, 但是方法同样适用原生客户端, 区别只在于flutter端是通过sdk发送消息至原生来实现.
iOS端:
基于Universal Links实现, 不受微信控制, 此处不细说, 官网照做就行
安卓端:
- 浏览器内:
通过DeepLink方式唤起app并传递参数, 例如:YOURSCHEME://aa/bb?c=d - 微信内:
基于微信sdk唤起app并传递参数, 用于微信内网页跳转至app, 标签名<wx-open-launch-app>, H5端和后台需要接入, 具体查看微信文档
Flutter端:
依赖库:
fluwx: 3.6.1+4
uni_links: 0.5.1
监听双端link跳转方法
iOS的Universal Links和安卓的Deeplink均会走下面的方法
/// 监听外部的跳转链接
initUniLinks() async {
var __dealUri = (String url) {
if (url == null || url.isEmpty) {
return;
}
if (url.startsWith("Your.UniversalLink")) {
var routeName = url.replaceFirst("Your.UniversalLink", "");
// 此处替换为你自己的路由方法
Application.navigateTo(context, routeName);
} else if (url.startsWith("Your.CustomScheme")) {
var routeName = url.replaceFirst("Your.CustomScheme", "");
// 此处替换为你自己的路由方法
Application.navigateTo(context, routeName);
}
};
// 监听app未被kill时的跳转
linkStream.listen((event) {
__dealUri(event);
});
try {
// 获取冷启动连接
var url = await getInitialLink();
__dealUri(url);
} catch (e) {
}
}
从微信唤起app(安卓端)
苹果因为是系统级别的跳转, 所以没有这些逻辑
/// 监听微信跳转
void _initWechat() {
__dealUrl(String msg) {
if (msg == null) {
return;
}
var route;
try {
// 这里的取值逻辑自己和H5对接就行
msg = Uri.decodeQueryComponent(msg);
var map = jsonDecode(msg);
route = map["route"];
} catch (e) {
}
if (route != null) {
// 此处替换为你自己的路由方法
Application.navigateTo(context, route);
}
}
/// 冷启动链接获取
fluwx.getExtMsg().then((url) {
if (url?.startsWith("wechatextmsg://") ?? false) {
Uri uri = Uri.parse(url);
try {
// extmsg的值需要encode,不然无法解析成功
var data = uri.queryParameters['extmsg'];
// 兼容处理
if (data == null) {
data = url.replaceFirst('wechatextmsg://com.ganlin.app/?extmsg=', '');
}
var json = jsonDecode(data);
var path = json['route'];
Application.navigateTo(context, path);
} catch (e) {
}
} else {
__dealUrl(url);
}
});
// 监听app未被kill时的跳转
fluwx.weChatResponseEventHandler.listen((event) {
if (event is fluwx.WeChatShowMessageFromWXRequest) {
var msg = event.extMsg;
__dealUrl(msg);
}
});
}
以上完成, 双端均可在浏览器和微信直接唤起app并跳转到指定页面
附上一张安卓端效果图:
安卓端微信内直接唤起app
