应用宝跳转

时间：2024-04-01 09:48:59

应用宝跳转

 

 

http://a.app.qq.com/o/simple.jsp?pkgname=com.huajiao&ckey=CK1335380772497&android_schema=huajiao://huajiao.com/goto/live?liveid=108884676&userid=28306796

 

http://wiki.open.qq.com/index.php?title=mobile/%E5%BA%94%E7%94%A8%E5%AE%9D%E5%BE%AE%E4%B8%8B%E8%BD%BD

 

应用宝微下载

目录

[隐藏]

 

https://segmentfault.com/a/1190000005967865?utm_source=tuicool&utm_medium=referral

 

先声明一下关于ios中9.0打开方式的文章来自博客：IOS9通用链接（universal link）

前言

对于一个完备的互联网产品而言需要有app端与web端两个不同前端，对于产品而言很多都希望能够将wap页上的用户引向native app上这就要求前端工程师们为网页提供各种入口去打开app，今天我们就聊一聊app的打开方式（有错误的地方还请高手指正）。

常规打开

对于app打开而言最常规的打开就是通过url scheme的方式去打开你的app，如下的

myapp://
myapp://open
myapp://type=1&id=2sdeo223lwe

这些抛出都是以url的方式进行抛出，app捕捉到这些抛出去做相应的处理，本文对app的处理不做详细描述，app开发请自行谷歌百度。对于前端而言抛出的方式也有很多，而最理想的方式是通过iframe的src对其进行链抛出，来！说的在多都没有代码来的清晰，请看下面。

首先我们需要有一个iframe：

//实际上就是新建一个iframe的生成器
var  createIframe=(function(){
  var iframe;
    return function(){
        if(iframe){
            return iframe;
        }else{
            iframe = document.createElement('iframe');
            iframe.style.display = 'none';
            document.body.appendChild(iframe);
            return iframe;      
        }
    }
})()

之后我们还需要一个url scheme:

//生成一个url scheme,假设我们约定的scheme是myApp://type=1&id=iewo212j32这种形式的

var baseScheme = "myApp://"
var createScheme=function(options){
    var urlScheme=baseScheme;
    for(var item in options){
        urlScheme=urlScheme+item + '=' + encodeURIComponent(options[item]) + "&";
    }
    urlScheme = urlScheme.substring(0, urlScheme.length - 1);
    return encodeURIComponent(urlScheme);
}

这种scheme形式的其实不是最好的,根据我们踩过的坑，觉得约定为与http协议相近可能更好一些，具体的协议需要前端人员自己去和app端人员约定。

ok万事具备，iframe有了，urlScheme也有了，该去打开app了

var openApp=function(){
    var localUrl=createScheme();
    var openIframe=createIframe();
    if(isIos()){
        //判断是否是ios,具体的判断函数自行百度
        window.location.href = localUrl;
        var loadDateTime = Date.now();
        setTimeout(function () {
            var timeOutDateTime = Date.now();
            if (timeOutDateTime - loadDateTime < 1000) {
                window.location.href = "你的下载页面";
            }
        }, 25);
    }else if(isAndroid()){
        //判断是否是android，具体的判断函数自行百度
        if (isChrome()) {
            //chrome浏览器用iframe打不开得直接去打开，算一个坑
            window.location.href = localUrl;
        } else {
            //抛出你的scheme
            openIframe.src = localUrl;
        }
        setTimeout(function () {
            window.location.href = "你的下载页面";
        }, 500);
    }else{
        //主要是给winphone的用户准备的,实际都没测过，现在winphone不好找啊
        openIframe.src = localUrl;
        setTimeout(function () {
            window.location.href = "你的下载页面";
        }, 500);
    }
}

以上就是你要打开scheme的主要代码了，好吧，实际上不只是打开app，还要实现未打开的时候跳到下载页去。其中安卓实际上无论有没有打开都会跳到下载页去，而ios……..好吧!按照网上的说法是浏览器失焦后会挂起脚本，呵呵，这是多老的ios版本的表现了，实际上现在的ios已经没有这么做，有些版本会跟安卓的表现一样，而有些则是直接跳转根本不会去打开，还有打开的时候那个恶心的系统弹窗是什么鬼。好吧，实际上至此你会发现，ios9.0以上的有些打不开直接跳，有些打得开还会有允许弹窗，而微信则是无论如何都打不开，实际上微信会在他的浏览器里拦截掉所有未经其允许的scheme包括app store，那么接下来我们要解决这些问题。

通用链接

针对ios9及以上的打不开问题，实际上ios9提供了更好的解决方案————通用链接。

什么是Universal Links(通用链接)?

这是iOS9推出的一项功能，如果你的应用支持Universal Links(通用链接)，那么就能够方便的通过传统的HTTP链接来启动APP(如果iOS设备上已经安装了你的app，不需要额外做任何判断等)，或者打开网页(iOS设备上没有安装你的app)。或许可以更简单点来说明，在iOS9之前，对于从各种从浏览器，Safari、UIWebView或者 WKWebView中唤醒APP的需求，我们通常只能使用scheme。

以上来自网上关于通用链接的介绍，对于前端简单点讲就是你访问一个http的url，如果这个url带有你提交给开发平台的配置文件中匹配规则的内容，ios系统会去尝试打开你的app，如果打不开，系统就会在浏览器中转向你要访问的链接。很好的一个属性，因为通过这个属性在ios9上我们能够绕过微信的拦截从而打开app。

以下是ios开发人员要做的百度搜索结果第一条ios中实现通用链接：

而我们要做的真的很简单，实际上我们只需要抛出链接就好了（实际上博主只是来骗经验的）。在此之前请准备好与主站不同的域名，比如主站www.xxxx.com，你们可以准备好open.xxxx.com的域名作为重定向用。好吧！实际上通用链接有一个很坑的属性，必须是异域打开，而且如果你提交的是你主站的链接，你打开你的主站你会发现网站上方会挂着一个难看的灰条转向appstore中你们的app，没错，就是ios系统干的这个事，具体的其他注意事项可以参考这篇文章IOS9通用链接（universal link）。

那么接下来我们的代码得做好更改

//增加通用链接的生成,
var baseScheme = "myApp://",
    baseLink="http://m.xxxx.com?";
var createScheme=function(options,isLink){
    var urlScheme=isLink?baseLink:baseScheme;
    for(var item in options){
        urlScheme=urlScheme+item + '=' + encodeURIComponent(options[item]) + "&";
    }
    urlScheme = urlScheme.substring(0, urlScheme.length - 1);
    return isLink?urlScheme:encodeURIComponent(urlScheme);
}

然后对抛出做

var openApp=function(){
    //生成你的scheme你也可以选择外部传入
    var localUrl=createScheme({type:1,id:"sdsdewe2122"});
    var openIframe=createIframe();
    if(isIos()){
        //判断是否是ios,具体的判断函数自行百度
        if(isGreaterThan9()){
            //判断是否为ios9以上的版本,跟其他判断一样navigator.userAgent判断,ios会有带版本号
            localUrl=createScheme({type:1,id:"sdsdewe2122"},true);//代码还可以优化一下
            location.href = localUrl;//实际上不少产品会选择一开始将链接写入到用户需要点击的a标签里
            return;
        }
        window.location.href = localUrl;
        var loadDateTime = Date.now();
        setTimeout(function () {
            var timeOutDateTime = Date.now();
            if (timeOutDateTime - loadDateTime < 1000) {
                window.location.href = "你的下载页面";
            }
        }, 25);
    }else if(isAndroid()){
        //判断是否是android，具体的判断函数自行百度
        if (isChrome()) {
            //chrome浏览器用iframe打不开得直接去打开，算一个坑
            window.location.href = localUrl;
        } else {
            //抛出你的scheme
            openIframe.src = localUrl;
        }
        setTimeout(function () {
            window.location.href = "你的下载页面";
        }, 500);
    }else{
        //主要是给winphone的用户准备的,实际都没测过，现在winphone不好找啊
        openIframe.src = localUrl;
        setTimeout(function () {
            window.location.href = "你的下载页面";
        }, 500);
    }
}

实际上就只需要更改这么点，最重要的是app端接入通用链接，注意抛出的链接不要跟主站同域即可，之后就是不断的调试，自己去踩坑吧，记得绑定域名，这个对域名具有一定的依赖性。

微信中打开

至此只有微信是打不开的，实际上腾讯系的产品都是打不开的，包括qq浏览器。

对于微信中有两种方式：

  • 一种简单的方式就是弹窗告诉用户让他去浏览器中打开——在技术之外的办法
  • 还有一种方式就是应用宝

是的如果是微信就去打开你的app对应的应用宝，应用宝会去检测你的app是否存在有则去打开，但只是去打开。实际上腾讯的应用宝对于开发者在功能上做的比想象中的要强大，你在应用宝的微下载中配置申请你的applink与app store的链接,之后你只要在你的链接参数中带上android_schema="myApp://"就在应用宝中打开app中的特定功能，如果忽略应用宝的页面跟自己scheme打开没有太大区别，具体的操作可以查看应用宝的说明。简而言之，腾讯的产品中都去借助应用宝这个平台去执行你需要的操作。在此就不贴代码了，只要判断浏览器如果是微信或者是qq就去跳你的应用宝链接就行。

总结

实际上单纯打开app非常简单，目前无论安卓还是ios都能够很好的支持scheme，当然腾讯系产品除外，实际上百度浏览器也会拦截scheme（我觉得真是奇了葩！！！微信这种尚能理解，一个浏览器居然擅自去拦截scheme）目前对百度浏览器还没有什么很好的办法，可以尝试是否能够通过百度应用市场去解决。如果是希望打开app同时又要打开下载页，那么ios9及以上就得用通用链接去解决，重点就是这个通用链接。

 

http://www.jianshu.com/p/d8b1461607d5

 

一个二维码实现苹果和安卓两个市场安装包自动分发

应用宝跳转

 

作者 老夫的天 关注

 

2016.06.03 11:42 字数 1867 阅读 1225评论 3喜欢 2

概述

现在的各种市场推广方式，不论是平面的还是多媒体的，都能看到二维码的身影了，可以说是二维码满天飞。扫一扫的方式几乎已经深入人心，这一方面微信可谓功不可没，现在也是树敌无数（如果这一句你不懂，请继续看）。

现在任何移动应用，一个App（有人读a-p-p，有人读“爱坡”，个人比较喜欢后一个）都要有基本的三件套：IOS、安卓、H5页面，为什么要有IOS和安卓自不必多说，为什么必须要有一套H5页面呢？他最大的功能也就在于分享—分享app里面的内容页，因为你不能把整个App的原生页面通过微信、QQ或者微博分享出去，如果能你也是事倍功半。一个H5页面轻轻松松分享出去，还可以让看到分享的人在你更多的H5页面里游弋，进而引导用户下载你的App。

回到二维码的扫描下载，我们的App有IOS和安卓两个安装包如何使用一个二维码提供统一的分发效果，也就是你用安卓机器扫我，我给你安卓市场的安装包，你用苹果扫我，我给你苹果商店的安装包？

对于为什么要有上述的实现方式，唯一能说的是“这是标配”，最简单的标配。

关于实现方式，接下来一一道来。

html页面提供两个按钮

这是最直接和简单的方式，二维码直接对应到一个html页面地址，页面中提供两个按钮，一个安卓下载，一个IOS下载，两个按钮分别跳转到不同的市场。这里贴一个网利宝的分发页面。注意页面里面的温馨提示，这必须有，因为“下载iOS版本”的按钮在苹果手机的微信中不能实现页面跳转，这也就是应用宝狠毒的地方了，屏蔽了别人的跳转，只需自己的跳转。

应用宝跳转

通过java后台自动跳转

上述html页面的方式需要用户多一步点击操作，所以对于有洁癖的产品经理来说肯定是不愿意了，老大的不愿意，其实对于有洁癖的技术来说也是老大不愿意的。

好，既然是JAVA的系列文章，那么这里就说说JAVA后台怎么去做自动的识别和跳转。

自动识别和跳转的原理就是通过UserAgent这个头标记去判断用户使用的是哪一种浏览器，从而判断用户使用的手机，再进行自动跳转。

使用：

String userAgent = request.getHeader(“User-Agent”)

即可。以下片段是判断和跳转代码：

if(userAgentString.contains(“iphone”)||userAgentString.contains(“ipad”)){

if(userAgentString.contains(“micromessenger”)){

response.sendRedirect(“http://mp.weixin.qq.com/mp/redirect?url=http://lnk8.cn/hgscsc”);

}else{

response.sendRedirect(“https://itunes.apple.com/cn/app/jie-dai-bao/id983151079?mt=8&v0=WWW-GCCN-ITSTOP100-FREEAPPS&l=&ign-mpt=uo%3D4”);

}

}else if(userAgentString.contains(“Android”)){

if(userAgentString.contains(“micromessenger”)){

response.sendRedirect(“http://mp.weixin.qq.com/mp/redirect?url=http://lnk8.cn/hgscsc”);

}else{

response.sendRedirect(“http://www.wandoujia.com/apps/com.letv.android.client”);

}

}else{

response.sendRedirect(“http://www.wandoujia.com/apps/com.letv.android.client”);

}

以上片段中的micromessenger判断的是该浏览器是否为微信的浏览器。以上片段中的跳转方式是微信6以前可以使用的一种跳转方式，新版本的微信中该方法已经失效了。也就是说上述方法在微信以外的浏览器中能够自动跳转，在新版本微信（仅苹果版不可以）中不跳转。

通过应用宝的微下载

应用宝是腾讯的亲儿子，因为要护犊子，所以给他便利条件是一定的。通过应用宝微下载提供的连接可以实现自动的机型识别和跳转，微信扫描也是畅通无阻，想跳就跳。使用这种方式跳转的现在应该不在少数，应用宝的用户覆盖率已经位居首位（29.14%），比如上半年爆出全员涨薪50%的蘑菇街采用的就是应用宝的微下载分发方式，扫描他们二维码内嵌的地址是：

http://a.app.qq.com/o/simple.jsp?pkgname=com.mogujie&ckey=CK1297357395787。

应用宝在这个地址的服务中已经加入了手机型号的识别和自动跳转，并且不受微信WebView的拦截。

申请应用的微下载也很简单：

1.在应用宝上线你的安卓版本App；

2.审核通过后在开发者平台选择“合作能力”中的“微下载”，点击“立即使用”；

应用宝跳转

3.确认之后，会跳转到应用管理微下载管理页面，其中的微下载地址就是我们需要用来生成二维码实现自动安装包自动分发的地址了；

应用宝跳转

4.接下来需要绑定苹果商店的下载地址，当你的IOS应用通过审核后，拿到苹果商店应用的下载地址；

5.选择微下载页面的“自定义推广模板”，将你的IOS应用下载地址写入“绑定IOS地址”下面的文本框中；

应用宝跳转

6.提交申请，大概会在1-2个工作日内完成审核，之后就可以实现自动跳转分发了。

使用javascript在页面前端跳转

这种方式也有案例，比如现在比较火的小红书。它虽然不是用的微信微下载的连接地址进行的跳转，但是却能够在微信中畅通无阻，这里背后的原因我不是很清楚。但是从他跳转过去的应用市场仍然是应用宝来看，可能是两家之间通过了某种协议，所以互相之间采用其他方式放行了。当然只是猜测，也有可能是小红书的技术过于强大，已经达到微信无法屏蔽的地步….

番外

有了以上的几种实现方法，这里在说一下在实际的生产过程中我们的应对策略。

由于二维码可能要被市场和运营印制到各种材料、资料上面最好是不轻易的改变，至少做到能不改就不改，就用这一个二维码。

那么如果我们最初用了第一种方案，后续想使用微下载方案：做法就是把你的html访问路径采用servletMapping或者spring的dispatcher方式映射到一个后台处理方法，在该方法中进行sendRedirect跳转（forward是不行的，因为forward只能在本服务中转，不能跳出容器到外部地址）。或者在你的html页面中使用javascript修改window.open去进行跳转，或者用meta的refresh方法。

关于sendRedirect、forward、meta刷新，可参http://jorton468.blog.163.com/blog/static/72588135201101711810508/

我选择的做法是：开始就采用一个后台映射的一个地址进行跳转，跳转到html页面。应用宝和苹果商店都审核下来之后，再把后台的跳转地址改成应用宝的微下载地址。

相关文章