外部呼起APP

发表于 | 阅读次数:

外部呼起APP

需求：
有如下产品：一个app，一个H5；
希望实现效果：
点击H5页面中的按钮时，

  • 如果用户已经安装APP，点击后唤起APP并跳到指定页；
  • 如果用户没有安装APP，点击后唤起appstore到此产品页面（安卓可直接下载）。

现有呼起方式：

1、 url scheme

  • ios8 以下用iframe呼起，其他用location.href呼起
  • Android 中判断ua为uc和三星则通过location.href呼起,其他走iframe

2、 Universal Links (iOS9+支持，但目前微信中有限制)
3、 appLinks (安卓6.0+支持，类似ios的Universal Links)
Android6.0新特性:App Links

4、 Smart APP Banner(ios，safari)
Html页面头里添加这样一行

1
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

  • content 属性可以传三个参数，以逗号隔开
  • app-id(必选) 填写应用在APPStrore的ID
  • affiliate-data(可选) 是iTunes 分销联盟计划的ID 一般用不到。
  • app-argument（可选）点击『打开』给APP传参数

4、 应用宝

触发呼起的方法

1、 加载一个iframe（src）
2、 插入一个a链接，模拟点击（href）
3、 location.href跳转
4、 手动点击a链接

根据是否呼起APP

  • universalLink无需判断，未呼起会自动跳配置的一个网址（自己的下载页）
  • setTimeout配合浏览器切换事件visibilitychange，qq浏览器为onvisibilitychange

    document.visibilityState == ‘hidden’
    如果已安装且立即呼起客户端了 会触发这个 - 短时间内hidden了 初略认为安装了且呼起成功

微信二次分享

https://mp.weixin.qq.com/wiki?action=doc&id=mp1421141115&t=0.9181586966788069#4

<<<<<<< HEAD:source/_drafts/外部呼起APP.md

文章

从前端角度出发-web吊起app

扩展

从前端的角度出发 – web 调起 APP

d4ee33bd4004dc486350acd33a74f9e0df478777:source/_posts/外部呼起APP.md
H5唤起APP指南(附开源唤端库)