网页端与App端互通
2017-11-23 本文已影响151人
起个名字真难999
最近在公司做web App项目,需要在webApp中打开原生App
如果本地有安装原生App,那就直接去打开原生App对应的页面,如果本地没有安装原生App,那就直接去下载这个原生App.
先看网页端的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button onclick="doCheck()">测试设备Main2</button></br>
</body>
<script type="text/javascript">
function doCheck() {
var ua = navigator.userAgent;
//判断浏览器的当前设备,是iPhone,还是Android
if(ua.indexOf('iPhone') > 0) {
alert('iPhone设备');
} else if(ua.indexOf('Android') > 0) {
//alert('Android设备');
checkAndroid();
} else {
alert('暂不支持你所用的系统,请使用Android或iOS系统')
}
}
//
function checkAndroid() {
//"banggu://是网页与App约定的协议,这个是自由的不需要限制"
//com.example.liuzenglong.newapp.Main2Activity 这个是我准备打开对应App的一个类
//?id=10000&userId ='liuzenglong'&password='123456'" //提供传递的参数给App
window.location.href = "banggu://com.example.liuzenglong.newapp.Main2Activity/get/info?id=10000&userId ='liuzenglong'&password='123456'"; /***打开app的协议,有安卓同事提供***/
window.setTimeout(function() {//这里500ms打不开App就会去下载页下载App
window.location.href = "http://www.baidu.com"; /***打开app的下载页***/
}, 500);
}
</script>
</html>
至此网页端的工作已经做完了,现在可以看App端,由于本人是做Android开发,这里只提供Android的实现方式.
Android需要做的事情
1.先在AndroidManifest的配置文件配置一下打开页面的数据
<activity android:name=".OpenFromWebActivity">
<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:scheme="banggu" />//这个是我们对应的协议,与网页里面需要保持一致,
</intent-filter>
</activity>
2. 在Activity里处理网页传递来的数据**
/**
* 获取Uri
*
* @return
*/
private String getUri() {
// 尝试获取WebApp页面上过来的URL
Uri uri = getIntent().getData();
if (uri != null) {
StringBuffer sb = new StringBuffer();
// 完整的url信息
sb.append("url: " + uri.toString());
// scheme部分
sb.append("\nscheme: " + uri.getScheme());
// host部分 用来对应对包名,
sb.append("\nhost: " + uri.getHost());
enterActivity(uri.getHost());
// 访问路劲
sb.append("\npath: "); //用来对应模块,
List<String> pathSegments = uri.getPathSegments();
for (int i = 0; pathSegments != null && i < pathSegments.size(); i++) {
sb.append("/" + pathSegments.get(i));
}
// Query部分 //用来对应模块需要的参数
sb.append("\nquery: ?" + uri.getQuery());
return sb.toString();
}
return null;
}
/**
* 进入对应的Activity
* @param activityName
*/
private void enterActivity(String activityName) {
try {
Class currentClass = Class.forName(activityName);
Toast.makeText(this, "---"+currentClass.getName(), Toast.LENGTH_SHORT).show();
Intent intent = new Intent(this, currentClass);
startActivity(intent);
} catch (ClassNotFoundException e) {
e.printStackTrace();
}
}
这样基本工作就已经做完了,具体页面,具体操作。