0

0

详解如何通过H5唤起本地app

小云云

小云云

发布时间:2017-12-13 10:28:08

|

15392人浏览过

|

来源于php中文网

原创

h5如何打开或者说唤起手机本地的app,纵观百度和google上面的答案,无非是两种:本文主要介绍了详解如何通过h5(浏览器/webview/其他)唤起本地app的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助到大家。

第一种方式:

通过在html的a标签里面的href中直接配置android端的schema,当然,如果有host其他的配置,跟在后面就可以了,android端配置和代码如下:

android端配置:

    
        
            
            
        
        
            
            
            
            
        
    

注:如果这个是配置在启动页要和标签并列在一起,不然运行后手机app的图标会没有;注意schema协议要小写,否则会有不能响应的异常!

html代码:


       
        
                      Insert title here
        
         
            打开app

 这里我们来看看schema拼接协议的格式:

< a href="[scheme]://[host]/[path]?[query]">启动应用程序< /a>

各个项目含义如下所示:

scheme:判别启动的App。 ※详细后述

host:适当记述

path:传值时必须的key ※没有也可以

query:获取值的Key和Value ※没有也可以

以上就能实现打开本地的app了,当然是在app存在的情况下,否则的话没有反应。

大家可能会问上面的html代码中配置的不是android里面配置的schema协议吗?我明明没有配置pid,为什么要写这个呢?这是因为我们有些时候在唤起本地app的时候可能会向app传递一些参数,这些参数我们就可以配置在这里,我们只需要在oncreate里面获取就可以了,代码如下:

Intent intent = getIntent();
    Uri uri = intent.getData();
    if (uri != null) {
        String pid = uri.getQueryParameter("pid");
    }

如果还想要获取android里面配置的schema协议的话,还可以这样:

Uri uri = getIntent().getData();
if(uri != null) {
 // 完整的url信息
 String url = uri.toString();
 Log.e(TAG, "url: "  + uri);
 // scheme部分
 String scheme = uri.getScheme();
 Log.e(TAG, "scheme: "  + scheme);
 // host部分
 String host = uri.getHost();
 Log.e(TAG, "host: "  + host);
 //port部分
 int port = uri.getPort();
 Log.e(TAG, "host: "  + port);
 // 访问路劲
 String path = uri.getPath();
 Log.e(TAG, "path: "  + path);
 List pathSegments = uri.getPathSegments();
 // Query部分
 String query = uri.getQuery();
 Log.e(TAG, "query: "  + query);
 //获取指定参数值
 String goodsId = uri.getQueryParameter("goodsId");
 Log.e(TAG, "goodsId: "  + goodsId);
}

 如何判断一个Schema是否有效 :

PackageManager packageManager = getPackageManager();
Intent intent = newIntent(Intent.ACTION_VIEW, Uri.parse("abraham://jingewenku.com:8888/goodsDetail?goodsId=10011002"));
List activities = packageManager.queryIntentActivities(intent, 0);
booleanisValid = !activities.isEmpty();
if(isValid) {
 startActivity(intent);
}

这种方式也是我百度到的最多的方式,但是这样就带来了一个问题了,上面的需求说的是“在页面上有一个连接, 如果用户安装了APP,则点击打开对应的APP;如果用户没有安装,则点击打开对应的设置连接”,这明显就不符合需求了,这只能作为一些个别需求来使用了。

第二种方式:

既然通过在href配置schema协议不行,那就只能通过js代码来实现了,只有这样才能根据判断实现app有的时候就打开,没有的时候就跳转到下载链接下载。
我们知道,js是无法判断手机是否安装了某款app的,所以我们只能够曲线救国了,我们可以获取时间如果,长时间不能呼起app则默认为没有安装这款app,然后跳转到下载页。当然这不是我想出来的,是网上的各位大佬的想法。在这里又要细分为两种情况了。

1.直接唤醒

说明:通过h5可换醒app,如访问一个URL,点击按钮,打开应用,如果该应用APP没有安装,那么直接跳转到App Store的APP下载页面,通过点击的方式兼容性较好,如果安装了app,在手机各大浏览器(360浏览器、uc浏览器、搜狗浏览器、QQ浏览器、百度浏览器 )和QQ客户端中,能唤醒。微信、新浪微博客户端、腾讯微博客户端无法唤醒。

代码如下:






点击唤醒demo




唤醒浙江移动手机营业厅!
   

2.点击唤醒

稿定AI设计
稿定AI设计

AI自动去水印、背景消除、批量抠人像工具

下载

说明:通过h5可换醒app,如访问一个URL就能直接打开应用,如果该应用APP没有安装,那么直接跳转到App Store的APP下载页面。兼容性一般:在手机各大浏览器(360浏览器、uc浏览器、搜狗浏览器 QQ浏览器、百度浏览器 )能唤醒。微信、QQ客户端、新浪微博客户端、 腾讯微博客户端无法唤醒。

代码如下:







直接唤醒demo




唤醒浙江移动手机营业厅!

 这样就完成了我们的需求了,在这个过程中,也遇到了很多热心人的讲解,这里记录一下,刚开始有人没理解我的需求,以为我是在android端来实现,让我通过包名的方式来检验app是否安装,这里记录一下方法,代码如下:

更多方法请查看我的工具类: CommonUtilLibrary

还有的就是以为我是要在app里面通过加载webview的形式来唤起本地的app,这里也记录一下,代码如下:

webView.setWebViewClient(new WebViewClient(){ 
            @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { 
                    Uri uri=Uri.parse(url);
                   if(uri.getScheme().equals("abraham")&&uri.getHost().equals("jingewenku.com")){ 
                            String arg0=uri.getQueryParameter("arg0");
                           String arg1=uri.getQueryParameter("arg1"); 
                      }else{ 
          view.loadUrl(url); 
        } return true; 
}});

还要注意的是,如果是在微信中唤起本地app,手机的微信中,是利用微信内置的浏览器(你可以将之前获取的页面在服务器上的地址发给你的任何联系人,点击发送的消息即可打开网页)打开那个简单的HTML页面,注意:直接打开scheme://host/datastring是不可行的,微信不会把这串字符解析成网址,必须包装成网页才能借助微信的浏览器打开。进入后就是我们刚刚设计的页面。这个时候,直接点击“启动应用程序”是不会唤醒之前安装的APP的,因为微信做了屏蔽,你需要在右上角的菜单中选择“在浏览器中打开”。这个时候,有些浏览器就可以唤醒,有些浏览器则不行,比如笔者测试机MX4上的内置浏览器不行,UC浏览器就能唤醒。部分浏览器不能唤醒,笔者查阅了很多资料也不能彻底解决,我现在唯一能想到的是将遇到问题的浏览器让前端做一个判断,提示不支持,应该使用什么浏览器。如果有读者有解决方案,敬请留言,多谢!

后记:

微信中为什么无法唤醒App,需要“用浏览器打开”?

因为微信对所有的分享连接做了scheme屏蔽,也就是说分享连接中所有对于scheme的调用都被微信封掉了。

那为什么有些应用是可以唤起的,比如大众点评,嘀嘀打车?

从非技术角度讲,因为大众点评,嘀嘀打车都是微信的干儿子,亲儿子。对于儿子有特殊照顾。

从技术角度讲,微信有一个白名单,对于在白名单中的分享连接是不会屏蔽掉scheme调用的。

听不明白?那我们举一个例子。

比如大众点评的分享连接是 http://dazhongdianping.share.1.com

对应到微信白名单中就会有 http://dazhongdianping 这一项,所有源自于这个连接的分享,都不会屏蔽scheme,

比如 http://dazhongdianping.share.2.com
http://dazhongdianping.share.3.com

就算是大众点评的子公司也可以http://zigongsi.dazhongdianping.share.3.com,根域名也在白名单中,所以也可以使用。

到这里,大家就应该明白,想借用大众点评的scheme,绕过这个问题是不可能的,除非你的分享连接能挂到大众点评的根域名上。

这个问题应该解释清楚了,另外提一句,对于下载apk这种,微信是屏蔽任何应用的,对于儿子也不例外,所以你想提供下载链接,无论你是不是儿子,都逃不过使用浏览器打开之中low的方式了.

附录:常见应用的URL Scheme

1,系统默认应用

名称 URL Scheme Bundle identifier
Safari http://
maps http://maps.google.com
Phone tel://
SMS sms://
Mail mailto://
iBooks ibooks://
App Store itms-apps://itunes.apple.com
Music music://
Videos videos://

2,常用第三方软件

名称 URL Scheme Bundle identifier
QQ mqq://
微信 weixin://
腾讯微博 TencentWeibo://
淘宝 taobao://
支付宝 alipay://
微博 sinaweibo://
weico微博 weico://
QQ浏览器 mqqbrowser:// com.tencent.mttlite
uc浏览器 dolphin:// com.dolphin.browser.iphone.chinese
欧朋浏览器 ohttp:// com.oupeng.mini
搜狗浏览器 SogouMSE:// com.sogou.SogouExplorerMobile
百度地图 baidumap:// com.baidu.map
Chrome googlechrome://
优酷 youku://
京东 openapp.jdmoble://
人人 renren://
美团 imeituan://
1号店 wccbyihaodian://
我查查 wcc://
有道词典 yddictproapp://
知乎 zhihu://
点评 dianping://
微盘 sinavdisk://
豆瓣fm doubanradio://
网易公开课 ntesopen://
名片全能王 camcard://
QQ音乐 qqmusic://
腾讯视频 tenvideo://
豆瓣电影 doubanmovie://
网易云音乐 orpheus://
网易新闻 newsapp://
网易应用 apper://
网易彩票 ntescaipiao://
有道云笔记 youdaonote://
多看 duokan-reader://
全国空气质量指数 dirtybeijing://
百度音乐 baidumusic://
下厨房 xcfapp://

H5的多线程如何实现Web Worker

H5实现桌面通知以及提示功能的实例

H5中如何获取和设置自定义属性

相关文章

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
c++ 根号
c++ 根号

本专题整合了c++根号相关教程,阅读专题下面的文章了解更多详细内容。

22

2026.01.23

c++空格相关教程合集
c++空格相关教程合集

本专题整合了c++空格相关教程,阅读专题下面的文章了解更多详细内容。

24

2026.01.23

yy漫画官方登录入口地址合集
yy漫画官方登录入口地址合集

本专题整合了yy漫画入口相关合集,阅读专题下面的文章了解更多详细内容。

99

2026.01.23

漫蛙最新入口地址汇总2026
漫蛙最新入口地址汇总2026

本专题整合了漫蛙最新入口地址大全,阅读专题下面的文章了解更多详细内容。

132

2026.01.23

C++ 高级模板编程与元编程
C++ 高级模板编程与元编程

本专题深入讲解 C++ 中的高级模板编程与元编程技术,涵盖模板特化、SFINAE、模板递归、类型萃取、编译时常量与计算、C++17 的折叠表达式与变长模板参数等。通过多个实际示例,帮助开发者掌握 如何利用 C++ 模板机制编写高效、可扩展的通用代码,并提升代码的灵活性与性能。

15

2026.01.23

php远程文件教程合集
php远程文件教程合集

本专题整合了php远程文件相关教程,阅读专题下面的文章了解更多详细内容。

65

2026.01.22

PHP后端开发相关内容汇总
PHP后端开发相关内容汇总

本专题整合了PHP后端开发相关内容,阅读专题下面的文章了解更多详细内容。

61

2026.01.22

php会话教程合集
php会话教程合集

本专题整合了php会话教程相关合集,阅读专题下面的文章了解更多详细内容。

63

2026.01.22

宝塔PHP8.4相关教程汇总
宝塔PHP8.4相关教程汇总

本专题整合了宝塔PHP8.4相关教程,阅读专题下面的文章了解更多详细内容。

33

2026.01.22

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
HTML5/CSS3/JavaScript/ES6入门课程
HTML5/CSS3/JavaScript/ES6入门课程

共102课时 | 6.8万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.7万人学习

前端开发(基础+实战项目合集)
前端开发(基础+实战项目合集)

共60课时 | 3.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号