Android 服务器外部h5与android进行交互

释放双眼,带上耳机,听听看~!

android中嵌入WebView可以快速实现app开发上线,交互的形式遇到的有三种:

第一:拦截H5界面的控件,具体实现请点击
Android如何利用JS来操作WebView里面的内容
第二:拦截H5界面的点击事件。
第三:为WebView的每一次网络请求的url添加标示位(参数)。

实现步骤:

  1. 服务器端与 app移动端规定 协议
  2. 移动端webView中通过协议,进行拦截处理

下面我们来看一下如何去拦截H5界面的点击事件:

// 设置Web视图
webview.setWebViewClient(new MyWebViewClient());

H5页面代码:(此页面放到服务器生成外网链接地址)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Carson_Ho</title>
<script>
function js2Android(){
/*约定的url协议为:lianjiu://webview?goodsId=111&consignorId=222*/
document.location = "lianjiu://webview?goodsId=111&consignorId=222";
}
</script>
</head>
<body>
<button type="button" id="button1" onclick="js2Android()">点击购买通知Android进去商品详情页面</button>
</body>
</html>

Android代码:
重写WebViewClient方法,

 // 复写WebViewClient类的shouldOverrideUrlLoading方法
mWebView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// 步骤2:根据协议的参数,判断是否是所需要的url
// 一般根据scheme(协议格式) & authority(协议名)判断(前两个参数)
//假定传入进来的约定的url协议为:lianjiu://webview?goodsId=111&consignorId=222(同时也是约定好的需要拦截的)
Uri uri = Uri.parse(url);
// 如果url的协议 = 预先约定的 js 协议
// 就解析往下解析参数
if (uri.getScheme().equals("lianjiu")) {
// 如果 authority  = 预先约定协议里的 webview,即代表都符合约定的协议
// 所以拦截url,下面JS开始调用Android需要的方法
if (uri.getAuthority().equals("webview")) {
//  步骤3:
// 执行JS所需要调用的逻辑
// 可以在协议上带有参数并传递到Android上
HashMap<String, String> params = new HashMap<>();
Set<String> collection = uri.getQueryParameterNames();
String goodsId = uri.getQueryParameter("goodsId");
String consignorId = uri.getQueryParameter("consignorId");
btnJS2Android.setText("商品Id为:" + goodsId + "---商家的Id为:" + consignorId);
}
return true;
}
return super.shouldOverrideUrlLoading(view, url);
}
}
);

结果:点击购买商品后,Android获取到对应的商品id跟商家id

注意事项://拦截之后在shouldOverrideUrlLoading中,可以采用Handler机制发送到主线程中进行后续操作,在方法中打印log语句失败,估计是线程引起的问题。

借鉴:Android与H5交互
Android 与h5交互 协议

人已赞赏
Android文章

android下载文件,文件总长度getContentLength返回-1

2020-3-5 15:16:39

Android文章

Android 与h5交互 协议

2020-3-5 15:55:39

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
有新消息 消息中心
搜索