实现目标:可以在h5页面点击按钮唤起App,如果没有下载改App,则打开应用市场对应的APP的下载页面。
实现步骤2步:
- 将打开App按钮设置为<a>标签,href值设置为App的scheme地址。
<a href = 'scheme' target = '_self'/>
- 同时开启定时器,3-5秒后跳转对应的应用商店(后面会说明为什么要延时并跳转到应用商店)
window.setTimeout(()=> {
window.location.href = '应用商店的scheme地址'}, delay)
为什么要延时几秒并跳转到应用商店?
因为使用跳转scheme地址的方式无法判断手机是否下载了App,同样也无法判断是否成功打开了App。
那么就会出现两种情况:
- 当下载了app时,可以成功跳转到App(有时会需要确认浏览器自动调起的确认跳转按钮才能跳转)。
- 未下载时,跳转会失败,安卓的用户端表现是什么都不会发生,ios则会弹窗报错(可以忽视)。
未下载时按照实现的目标则应该打开应用商店的app下载页面。所以为了处理未下载的情况,就无论是否下载了App,都在延时几秒后跳转到应用商店。
当然也可以有不同的用户交互方案以提升用户体验。比如进入页面就直接尝试进行打开app的逻辑,如果没有成功唤起则什么都不做。让用户自己去点击页面里的下载按钮,此时不需要延时了,而是直接打开应用商店。
标签:商店,App,h5,应用,跳转,scheme,下载 From: https://www.cnblogs.com/gongwenhao/p/17523524.html