请选择 进入手机版 | 继续访问电脑版

SEO圈子

 找回密码
 立即注册
搜索
查看: 31|回复: 0

html5唤起app的方法

[复制链接]

4

主题

5

帖子

24

积分

SEO圈子成员

Rank: 1

积分
24
发表于 2018-1-1 19:38:45 | 显示全部楼层 |阅读模式
h5唤起app这种需求是常见的。在移动为王的时代,h5在app导流上发挥着重要的作用。目前我们采用的唤起方式是url scheme(iOS,Android平台都支持),只需原生APP开发时注册scheme, 那么用户点击到此类链接时,会自动跳到APP。
三种唤起方案
  1. var last = Date.now(),
  2.     doc = window.document,
  3.     ifr = doc.createElement('iframe');

  4. //创建一个隐藏的iframe
  5. ifr.src = nativeUrl;
  6. ifr.style.cssText = 'display:none;border:0;width:0;height:0;';
  7. doc.body.appendChild(ifr);

  8. setTimeout(function() {
  9.     doc.body.removeChild(ifr);
  10.     //setTimeout回小于2000一般为唤起失败
  11.     if (Date.now() - last < 2000) {
  12.         if (typeof onFail == 'function') {
  13.             onFail();
  14.         } else {
  15.             //弹窗提示或下载处理等
  16.         }
  17.     } else {
  18.         if (typeof onSuccess == 'function') {
  19.             onSuccess();
  20.         }
  21.     }
  22. }, 1000);
复制代码
首页> H5教程> 正文
html5唤起app的方法
作者: default|标签:html5 h5 唤起|2017-12-5 13:24





h5唤起app这种需求是常见的。在移动为王的时代,h5在app导流上发挥着重要的作用。目前我们采用的唤起方式是url scheme(iOS,Android平台都支持),只需原生APP开发时注册scheme, 那么用户点击到此类链接时,会自动跳到APP。
三种唤起方案
iframe

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

var last = Date.now(),
    doc = window.document,
    ifr = doc.createElement('iframe');

//创建一个隐藏的iframe
ifr.src = nativeUrl;
ifr.style.cssText = 'display:none;border:0;width:0;height:0;';
doc.body.appendChild(ifr);

setTimeout(function() {
    doc.body.removeChild(ifr);
    //setTimeout回小于2000一般为唤起失败
    if (Date.now() - last < 2000) {
        if (typeof onFail == 'function') {
            onFail();
        } else {
            //弹窗提示或下载处理等
        }
    } else {
        if (typeof onSuccess == 'function') {
            onSuccess();
        }
    }
}, 1000);


iframe方案的唤起原理是: 程序切换到后台时,计时器会被推迟(计时器不准的又一种情况)。如果app被唤醒那么网页必然就进入了后台,如果用户从app切回来,那么时间一般会超过2s;若app没有被唤起,那么网页不会进入后台,setTimeout基本准时触发,那么时间不会超过2s。
window.location.href直接跳转
  1. window.location.href = nativeUrl;
复制代码
a标签唤起
  1. <a href="nativeUrl">唤起app</a>
复制代码



seo圈子-只为分享而存在的圈子:bbs.lichunseo.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

熊掌号|SEO圈子-只为分享而存在的圈子 ( 蜀ICP备17021932号-16 )

GMT+8, 2018-1-21 04:31

Powered by 黑帽SEO教程 X3.3 Designed By SEO教程

© 2017-2017 黑帽SEO

快速回复 返回顶部 返回列表