`
tipx
  • 浏览: 108995 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

单击链接打开APP,或自动跳转下载页

    博客分类:
  • js
阅读更多
手机等移动终端上的页面中,访问链接(使用APP的自定义协议)自动打开相应的APP,若未安装该APP,则重定向至下载页面或下载链接。

网上找的不够完整,参考了下淘宝,立贴备忘。

<a href="javascript:;" id="opener" >打开客户端</a>
<script type="text/javascript">
    var timer, ifr;
    document.getElementById('openApp').onclick = function(e){
        // 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP,并自动阻止a标签的默认行为
        ifr = document.createElement('iframe');
        ifr.src = 'myapp://xxxx';  //APP定义的打开协议
        ifr.style.display = 'none';
        document.body.appendChild(ifr);
        
        //1秒内未打开APP,则跳转下载等。
        timer = window.setTimeout(function(){
            location.href = "http://下载链接/..."; 
        }, 1000);
    }

    //摘自“淘宝”,打开APP后,自动移除下载跳转
    window.onblur = function(){
        if(timer){
            clearTimeout(timer);
            timer = null;
        }

        if(ifr){
            document.body.removeChild(ifr);
        }
    }
</script>


大部分代码摘自http://blog.woodbunny.com/tb.php?sc=2aab02&id=140
分享到:
评论

相关推荐

    html链接打开app并跳转至某个指定界面

    html点击链接打开app并跳转至指定的界面;...如果未登录,则先保存要跳转的界面数据然后到登录界面登录成功回来会自动跳转到需要跳转的界面;这里MainActivity的启动模式为singleTask,需要注意onNewIntent方法

    JS实现点击网页判断是否安装app并打开否则跳转app store

    c、安装完成后,APP下载页中提示:打开;用户继续点击打开 d、用户正常使用APP 2、用户第二次访问宣传页面 a、点击Banner,进入到APP Store中对应的APP下载页 b、APP下载页中提示:打开;用户直接点击打开 c、用户...

    微信下载APP跳转到浏览器页面,遮罩层提示,浏览器下载APP逻辑

    当用户点击一个指向APP下载的链接时,微信会检测该链接是否符合其安全标准。如果不符,微信会阻止直接下载,并引导用户通过更为安全的浏览器进行下载,以确保用户在知情的情况下进行操作。 接着,跳转到浏览器页面...

    微信跳转到浏览器下载APP实现代码

    是你的APP下载地址,`your_app_name.apk`是APK文件的名称。 3. **CSS样式(css)** CSS用于美化HTML页面,确保点击按钮的视觉效果吸引人。例如,你可以设置以下样式: ```css a { display: block; width: 200...

    扫描二维码跳转app下载链接

    android或ios通过扫描二维码,自动识别设备跳转对应的app下载页面or链接

    iOS和Android用同一个二维码实现跳转下载链接的方法

    前言 最近一个项目需要iOS和安卓使用一个二维码,让扫描的机器自己识别操作系统实现跳转...PS:该链接在微信环境打开时还是需要手动跳转到手机的浏览器才能跳到下载页面,因为微信内的webView比较特别,所以写了一个al

    h5页面唤起app如果没安装就跳转下载(iOS和Android)

    h5页面唤起app如果没安装就跳转下载(iOS和Android) 浏览器和app没有通信协议,所以h5不知道用户的手机释放安装了app。因此只能是h5去尝试唤起app,若不能唤起,引导用户去下载我们的app。 微信里屏蔽了 schema 协议,...

    h5唤醒APP,如果未下载跳转下载页,如果已下载唤醒APP

    5. **配置应用商店链接**:对于未安装APP的情况,需要提前准备好在应用商店的下载链接,通常是Google Play或Apple App Store的链接。当检测到APP未安装时,H5页面会自动重定向到这个下载页面。 6. **错误处理**:在...

    微信打开外部链接下载APP引导

    在iOS中,由于Safari的安全策略,不能直接通过`&lt;a&gt;`标签触发APP下载。但是,可以使用Smart App Banners,这是一种Web页面上的元标签,如`&lt;meta name="apple-itunes-app" content="app-id=myAppId"&gt;`,当用户在...

    APP间的相互跳转跳转

    1. Branch.io和DeepLink SDKs:对于跨平台的APP开发,可以使用第三方服务如Branch.io,它们提供了统一的SDK和API,简化了不同平台的深度链接和APP间跳转的实现。 2. Firebase Dynamic Links:Google的Firebase提供...

    微信跳转浏览器下载APP,打开网页实现代码.rar

    同时,我们还可以添加`target="_blank"`属性,确保链接在新窗口或新标签页中打开,这样就能实现从微信内部跳转到外部浏览器。 3. **JavaScript的引导跳转**:由于微信可能会拦截直接的APK下载链接,我们可以利用...

    APP下载落地页,自动识别安卓苹果

    本文将详细解析如何构建一个能够自动识别用户设备(安卓或苹果)的APP下载落地页,以及其背后的原理和技术实现。 首先,我们要理解APP下载落地页的核心功能。它的主要任务是根据用户使用的设备类型(Android或iOS)...

    【微信跳转接口】微信引导用户右上角打开浏览器,访问APP下载链接

    【微信跳转接口】微信引导用户右上角打开浏览器,访问APP下载链接,相关文章地址:https://blog.csdn.net/qq15577969/article/details/103236861

    jquery.autoapp:手机安装了自己的app就打开 没有安装就跳转到app下载页(如App store) 还可以根据URL scheme进行app内部跳转

    手机安装了自己的app就打开 没有安装就跳转到app下载页(如App store) 还可以根据URL scheme进行app内部跳转 使用: 场景一:app下载按钮(以安装就打开app) 下载本站App $(function() { $(".app-download")....

    ios应用内跳转到AppStore或者iTunes

    在iOS开发中,有时我们需要引导用户在应用内部直接跳转到AppStore或iTunes来查看应用详情、进行评分和评论,或者购买相关的媒体内容。这个功能对于提高应用的可见度和用户参与度至关重要。以下是对这个主题的详细...

    微信扫码下载app页面

    在微信扫码下载App的场景中,二维码包含了App的下载链接或者特定的识别码,当用户通过微信扫描二维码时,微信会解析这些信息并引导用户进行下一步操作。 2. **Android与iOS下载机制**:Android系统的App通常通过...

    微信扫描打开APP下载链接提示代码完整版.rar

    这个“微信扫描打开APP下载链接提示代码完整版.rar”文件可能包含了一个完整的解决方案,帮助开发者实现通过微信扫码直接跳转到App Store或Google Play进行应用下载的功能。以下是对这个技术的详细解释: 首先,...

    好看的APP下载页html单页源码.zip_APP下载页源码_app下载页 html_separateqfx_下载页源码_好看的

    首先,我们来理解APP下载页设计的核心要素。一个优秀的APP下载页面应该包含以下几个关键部分:1)应用的图标和名称,2)引人入胜的应用简介,3)平台兼容性信息,4)清晰的下载按钮,5)用户评价或评分,6)可能的话...

    微信实现自动跳转到用其他浏览器打开指定APP下载

    总之,微信自动跳转到其他浏览器打开指定APP下载的实现,不仅可以避免微信屏蔽下载链接的问题,而且能够大大提升APP在微信中的推广转化率,对于APP开发者和市场营销人员来说,这是一种非常有价值的解决方案。

Global site tag (gtag.js) - Google Analytics