扣丁学堂简述如何通过H5(浏览器WebView其他)唤起本地APP(一)

有不少的小伙伴对H5如何打开或者说唤起手机本地的APP不是很了解,本篇文章扣丁学堂小编就和大家分享一下如何通过H5(浏览器/WebView/其他)唤起本地APP,下面我们一起来看一下吧。

扣丁学堂简述如何通过H5(浏览器WebView其他)唤起本地APP(一)

HTML5培训

现在各类app,分享出去的H5页面中,一般都会带着一个立即打开的按钮,如果本地安装了app,那么就直接唤起本地的app,如果没有安装,则跳转到下载。这是一个很正常的推广和导流量的策略,下面进入我们今天的正题,H5如何打开或者说唤起手机本地的app,纵观百度和Google上面的答案,无非是两种:

第一种方式:

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

android端配置:

<activity android:name = ".MainActivity">

<intent-filter>

<action android:name = "android.intent.action.MAIN" />

<category android:name = "android.intent.category.LAUNCHER" />

</intent-filter>

<intent-filter>

<action android:name="android.intent.action.VIEW"/>

<category android:name="android.intent.category.DEFAULT"/>

<category android:name="android.intent.category.BROWSABLE"/>

<data android:host="jingewenku.com"

android:scheme="abraham"/>

</intent-filter>

</activity>

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

html代码:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

</head>

<body>

<a href="abraham://jingewenku.com/?pid=1">打开app</a><br/>

</body>

</html>

这里我们来看看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<String> 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<ResolveInfo> activities = packageManager.queryIntentActivities(intent, 0);

booleanisValid = !activities.isEmpty();

if(isValid) {

startActivity(intent);

}

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

由于篇幅问题,本篇文章扣丁学堂HTML5在线学习小编就先给大家分享一种通过H5(浏览器/WebView/其他)唤起本地APP的方式,稍后会为大家再次分享另一种方式。想要了解更多内容的小伙伴可以登录扣丁学堂官网咨询,扣丁学堂是专业的HTML5培训机构,不仅有专业的老师和与时俱进的课程体系,还有大量的,想要学好HTML5开发的小伙伴快快行动吧。

相关推荐