iOS 9 之前,一直使用的是 URL Schemes 技术来从外部对 App 进行跳转,但是 iOS 系统中进行 URL Schemes 跳转的时候如果没有安装 App,会提示 Cannot open Page 的提示,而且当注册有多个 scheme 相同的时候,目前没有办法区分,但是从 iOS 9 起可以使用 Universal Links 技术进行跳转页面,这是一种体验更加完美的解决方案。
直到 2019 年 7 月,Universal Link一直是被封的,市面上你能看到从微信里 H5 直接跳转到 App 的,大多是微信的协议 Api,只开放给“自己人”,比如:京东、得到...
那现在解封了,给了大家一个机会:可以考虑更多场景,将用户从私域流量导向 App,提升微信生态和 App 的联动效应,有利于更好的做服务和转化。
Universal Link
Universal Link 是 Apple 在 iOS 9 推出的一种能够方便的通过传统 HTTPS 链接来启动 APP 的功能。
如果你的应用支持 Universal Link,当用户点击一个链接时可以跳转到你的网站并获得无缝重定向到对应的APP,且不需要通过 Safari 浏览器。如果你的应用不支持的话,则会在 Safari 中打开该链接。
支持Universal Link(通用链接) 先决条件:必须有一个支持HTTPS的域名,并且拥有该域名下上传到根目录的权限(为了上传Apple指定文件)。
这个功能是 iOS 9.0 就推出的通过访问 http 链接去启动 App 的方式,相信你在刷知乎或者百度的时候,浏览器顶部一直会飘着用 App 打开这个,这个东西就是上面说的通用链接。
如下图,我在微信中打开虎嗅的分享链接,在微信的网页中会有一个横幅,点击横幅上的 "Go" 按钮,就会打开虎嗅的 App 并跳转到指定的那篇新闻(App 内部路由根据传参跳转)。
准备条件
拥有一个网站域名,且这个网站域名支持> https
。 如果你没有这个东西,后面这个教程就不用看了,直接去使用 mob
推出的 moblink 吧,可以使用他默认的域名和配置,按他的接入教程就可以了。
Xcode 项目配置
1、打开工程配置中的 Associated Domains
如果用的是 Xcode11,可以在 Signing&Capabilities 中添加 Associated Domains,如果用的 Xcode10,那就在 Capabilities 中打开 Associated Domains。
2、添加网站域名
网站域名以 applinks:
开头,那这里填写的就是 applinks:www.lazypig.net
。
3、配置文件
如果你的项目时自动生成签名和配置文件,那么这步可以省略,如果项目不是自动生成的,就需要去苹果开发后台,将对应的 appid
的 Associated Domains
配置打开,然后重新生成一次打包的配置文件。
Universal Link 的基本运作流程
- APP 第一次启动 or APP 更新版本后第一次启动
- APP 向工程里配置的域名发起 Get 请求拉取 apple-app-association Json File
- APP 将 apple-app-association 注册给系统
- 由任意 webview 发起跳转的 url,如果命中了 apple-app-association 注册过的通用链接
- 打开 App,触发 Universal Link delegate
- 没命中,webview 继续跳转 url
在你进行 apple-app-association 以及 App 工程的配置之后,整个 Universal Link 的运作流程完全由系统控制了。
网站配置
1.创建配置文件
新建一个名字为 apple-app-site-association
的纯文本文件,不要有任何后缀,文件内容为:
{ "applinks": { "apps": [], "details": [ { "appID": "团队ID.软件BundleID", "paths": [ "限制的域名"] } ] } }
比如你团队 ID 是 6PA8SXXXXX
,app 的 bundle id 是 com.hudongdong.blog
,只在 访问 www.lazypig.net/app/lazypig… 链接时才显示顶部的用 App 打开,其他网站层次不显示,那么这个文件的内容就是:
{ "applinks": { "apps": [], "details": [ { "appID": "6PA8SXXXXX.com.hudongdong.blog", "paths": [ "/app/lazypigquick/*"] } ] } }
如果填了限制的 paths
,在其他网站例如微信后台,填写 Universal Links 就是填写 www.lazypig.net/app/lazypig…
如果没有限制 paths
,填写的是*,那么前端和后台填写的地址就是 www.lazypig.net/,全站的头部都显示用 App 打开,那么 paths 修改为 "paths": [ "*"]
即可。
apps 参数
apps
这个字段保持为空数组即可。
details 参数
details
是指定哪个页面用哪个 App 打开的数组,如果你有多个路径指定不同的 App,按照 paths
规则添加对应的 appID
和 paths
即可。
paths 参数
这个 paths
路径的更多限制规则可以参考下面:
- 使用*指定整个网站
- 包含特定的网址(例如/wwdc/news/)以指定特定的链接
- 附加到特定的网址(例如/videos/wwdc/2015/)以指定网站的一部分
- 除了用于匹配任何子字符串之外,您还可以?用于匹配任何单个字符。您可以将两个通配符合并在一个路径中,例如/foo//bar/201?/mypage
- 路径字符串的开头添加 NOT 指定不应作为通用链接处理的区域,例如
"paths": [ "/videos/wwdc/201?/*" , "NOT /videos/wwdc/2010/*"]
然后将这个文件上传到网站根目录,或者在根目录新建一个名字为 .well-known 的子目录,然后把这个文件上传到这个子目录中。