分享

android/iPhone:如何从browser直接打开应用程序或者打开应用商店(如果没有应用程序)

 quasiceo 2014-09-08
2011-07-21 17:17 11398人阅读 评论(10) 收藏 举报
  1.   
最近在做一个项目,该项目的前身是为mobile browser量身打造的一个网站。现在有这样一个需求:

当用户在用mobile browser浏览该网站的时候会点击一个按钮/超链接,通过这个按钮的点击事情需要打开安装在本机的应用程序,或者如果本机没有安装该应用程序则打开应用商店并打开该程序在商店中的搜索结果页面。

刚开始的时候iPhone team的人给出一个solution,下面是实施跳转的HTML + javascript源代码。

  1. <html>   
  2.     <head>   
  3.         <meta name="viewport" content="width=device-width" />   
  4.     </head>   
  5.     <body>   
  6.         <h2><a id="applink1" href="mtcmtc://profile/116201417">Open scheme(mtcmtc) defined in iPhone with parameters </a></h2>   
  7.         <h2><a id="applink2" href="unknown://nowhere">open unknown with fallback to appstore</a></h2>   
  8.         <p><i>Only works on iPhone!</i></p>      
  9.           
  10.         <script type="text/javascript">   
  11.             // To avoid the "protocol not supported" alert, fail must open another app.  
  12.             var appstore = "itms://itunes.apple.com/us/app/facebook/id284882215?mt=8&uo=6";  
  13.             function applink(fail){  
  14.                 return function(){  
  15.                     var clickedAt = +new Date;  
  16.                     // During tests on 3g/3gs this timeout fires immediately if less than 500ms.  
  17.                     setTimeout(function(){  
  18.                               // To avoid failing on return to MobileSafari, ensure freshness!  
  19.                               if (+new Date - clickedAt < 2000){  
  20.                               window.location = fail;  
  21.                               }  
  22.                               }, 500);      
  23.                 };  
  24.             }  
  25.             document.getElementById("applink1").onclick = applink(appstore);  
  26.             document.getElementById("applink2").onclick = applink(appstore);  
  27.             </script>   
  28.     </body>   
  29. </html>  

其原理就是为HTML页面中的超链接点击事件增加一个setTimeout方法.

如果在iPhone上面500ms内,本机有应用程序能解析这个协议并打开程序,则这个回调方法失效;如果本机没有应用程序能解析该协议或者500ms内没有打开个程序,则执行setTimeout里面的function,就是跳转到apple的itunes。


我用同样的原理来处理android的javascript跳转,发现如果本机没有程序注册intent-filter for 这个协议,那么android内置的browser就会处理这个协议并且立即给出反应(404,你懂的),不会像iPhone一样去执行setTimeout里面的function,即便你把500ms改成0ms也不管用。

我就开始了我的Google search之旅,最终在stackoverflow一个不起眼的地方找到solution。

不解释,先给出源代码

android里面androidManifest.xml文件对activity的配置,如何配置就不表述了,表达能力有限,请参考developer.android.com

  1. <activity android:name=".ui.UploadActivity" android:screenOrientation="portrait">  
  2.             <intent-filter>  
  3.                 <data android:scheme="http" android:host="192.168.167.33" android:port="8088" android:path="/mi-tracker-web/download.html"/>  
  4.                 <action android:name="android.intent.action.VIEW" />  
  5.                 <category android:name="android.intent.category.DEFAULT" />  
  6.                 <category android:name="android.intent.category.BROWSABLE" />  
  7.             </intent-filter>  
  8.         </activity>  


HTML页面中指向该应用程序的hyperlink
  1. <a id="applink1" href="http://192.168.167.33:8088/mi-tracker-web/download.html">  
  2.             Open Application</a>  

不难发现,在androidManifest.xml中配置的filter中data的属性表述,在下面的HTML.href中全部看到了。请注意,这两个路径要全部一致,不能有差别,否则android系统就不会拦截这个hyperlink。

好了,为什么我说这个solution能解决我们当初提出来的需求呢,答案在这里:

如果说本机安装了这个应用程序

在android browser中点击HTML中的applink1,browser会重定向到指定的链接,但是由于我们的应用程序在android OS中配置了一个intent-filter,也是针对这个制定的链接。就是说现在android系统有两个程序能处理这个链接:一个是系统的browser,一个是配置了intent-filter的activity。现在点击这个链接,系统就会弹出一个选择:是用browser还是你指定的activity打开。如果你选择你的activity,系统就会打开你的应用程序,如果你继续选择用browser,就没有然后了。


如果说本机木有安装这个应用程序

那么这个HTML里面的这个超链接就起很重要的左右了,这个download.html里面可以forward到android的应用商店

download.jsp源代码如下。具体为什么请求的是download.html这个地址却访问到了download.jsp,就不解释了,struts2的东西。

  1. <%@ page language="java" contentType="text/html; charset=ISO-8859-1"  
  2.     pageEncoding="ISO-8859-1"%>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www./TR/html4/loose.dtd">  
  4. <html>  
  5. <head>  
  6. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">  
  7. <title>Insert title here</title>  
  8. </head>  
  9. <body>  
  10.     <script type="text/javascript">  
  11. <span style="white-space:pre">  </span>window.location="market://search?q=com.singtel.travelbuddy.android";</script>  
  1. </body>  
  2. </html>  

唉,文笔不行,估计我写出来自己都不怎么看得懂。就再把跳转的关键点说一下:

在androidManifest.xml中定义intent-filter的时候定义的scheme,host,port,path拼凑起来是一个有用的HTTP路径,这样就算本机没有activity定义了intent-filter来捕获这个链接,那这个链接也会重定向到打开android market place的页面,继而打开应用商店。因为每个android手机都会捕获到market这个协议(如果android手机里面没有market商店,不怪我哈),系统就会自动打开market place应用商店并根据参数进入搜索页面并显示结果。


如果有什么写得不好的地方或者有更好的方法,希望大家拿出来分享。For you, for me, for everybody.

5
1
主题推荐
应用程序 应用商店 iphone browser android
猜你在找
Android基于cordova3.3的插件开发
学习NodeJS第二天:漫谈NodeJS
Android: eclipse 使用@hide API
Spring:注解
tomcat+solr在windows下运行配置
Android短信的备份和回复
event的回调函数定义及event结构和event_base结构中各个成员的描述
tcp拥塞控制
内存检测工具-addressSanitizer
解读Android LOG机制的实现:(3)JNI及c/c++域写设备文件
查看评论
10楼 dance_八戒 2014-06-30 10:07发表 [回复]
这个不用这么麻烦,你单指定一个schema就行了
9楼 飞鱼2014 2014-04-03 11:31发表 [回复]
感觉你这个只是给用户多了一种对链接的打开方式的选择,要是已经在浏览器里,貌似就不会提示了!理想效果是做到类似天猫那样的,点击手机浏览器上的按钮,直接跳转到天猫手机客户端指定店铺的界面,当然前提是先安装了客户端
8楼 瑞拉 2013-08-18 18:12发表 [回复]
试验了一下,是可以打开的。我想说如果点击超链接的同时同时希望传参给另一个应用程序,应该怎么处理呢?
7楼 mawentao 2013-08-16 15:58发表 [回复]
点击没反应呢,还是该怎么执行就怎么执行,没差别呢。
6楼 sunnyboylv123 2013-07-29 10:52发表 [回复]
goolePlay 可以打开自己的不能打开大神求帮助
5楼 zoulu1 2013-07-17 23:27发表 [回复]
download.html在哪?
4楼 gggyniidt 2013-04-24 16:28发表 [回复]
默认浏览器 有的能用 有的不能用 弹不出选择框 但用程序发送intent可以 是不是浏览器拦截了啊 望老大指点迷津 救我等于水火。……
3楼 金色闪光4 2013-03-19 17:05发表 [回复]
部分浏览器是不支持的,

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多