网页跳转到APP 安卓&IOS 小白常见问题一文看懂

Mashiroww
323 阅读2分钟

前言

网上的教程有很多，本文主要是以小白角度，对网上教程没讲到的部分做一些补充。ios较麻烦，下面推一个好文： ios跳转：juejin.cn/post/684490…

安卓 比较简单 使用URL Scheme：

  • 在AndroidManifest.xml中定义scheme：
<intent-filter>
    <action android:name="android.intent.action.VIEW"/>
    <category android:name="android.intent.category.DEFAULT"/>
    <category android:name="android.intent.category.BROWSABLE"/>
    <!--主要是加上这行！！！host可以不填，scheme必填，通常为你的包名或者拼音-->
    <data android:scheme="xxx"
          android:host="open"/>
</intent-filter>
  • 如果上面的scheme为xxx，host为open。那网页中调用的链接为
window.location.href = `xxx://open`;
  • 如果要加参数，则为
window.location.href = `xxx://open?params1=demostring&params2=demostring`;

ios 使用Universal Link

涉及到的设置有些多，为避免混乱，我在此先列举出来（都有例子）：

  1. app使用的后端业务接口域名 例：www.demo.business.com
  2. 分享页网页的域名 例：www.share.com
  3. apple-app-site-association文件,内容如何写去juejin.cn/post/684490… 看 以下是示例:
{
    applinks: {
    apps: [],
    details: [
      {
        appID: "ABCDEFG1.app.demo.demoapp",
        paths: ["/open/*"],
      },
    ],
  },
};
}
  1. xcode中的Associated Domains applinks:demo.business.com

ios 配置步骤

  1. 创建一个文件，文件名是apple-app-site-association，文件不要有任何后缀。文件内容怎么写可以看上面的掘金文章链接。将其给后端同学让他放到www.demo.business.com 的根目录下。要求是能在公网用www.demo.business.com/apple-app-site-association 访问到该文件
image.png
  1. 打开Xcode-Signing & Capabilities里,点击Capability+，选择Associated Domains。将applinks:demo.business.com写到Associated Domains里。 注意！applinks:是固定的，后面跟的是www.demo.business.com 去掉www.和https:// 后得到的域名。
image.png
  1. 在分享页www.share.com 中定义一个点击事件，调用www.demo.business.com/open即可唤起APP。

注意事项 & 失败可能的原因

  1. 分享页的域名和跳转链接的域名必须跨域，相同域名则不生效。上面例子里分享页为 www.share.com ，跳转链接为 www.demo.business.com ，是跨域的。
  2. 在xcode里，applinks:后面跟的一定是跳转域名去掉前面的协议和www。上面例子为applinks:demo.business.com
  3. apple-app-site-association文件放的域名和网页跳转链接用的域名是一个，正常来说都是app使用的后端接口业务域名，如唤起失败请检查。
  4. 可以让后端同学对www.demo.business.com/open 配置一个重定向，重定向到官网或者你们的下载链接都行。因为正常情况安装了app会跳转，没安装手机会按正常url处理，会跳到这个网址下面，如果没这个路径就会404，不太优雅。
avatar
文章
阅读
粉丝