源生代码和H5的交互 android:
1: 默认的事情:
Android 通过内置的UI控件WebView来加载网页。
网页是用一个网络地址来表示的:
其整个使用方法很简单如下:(android不关心实际的html5代码)
String mUrl ="http://www.baidu.com"; //代表了某个网页的网址
WebView mWebView = newWebView(); //用来家在网址的UI控件
mWebView.loadUrl(mUrl); //加载指定网址
2:Html5 调用 android 本地方法
2.1 Html5 调用 android 本地方法一
a: android 本地将被Html5调用的方法都定义在一个Object中。【假定这个Object 叫 JavaScriptInterface1 】(暴露给html5的方法)
b:WebView通过addJavascriptInterface(new JavaScriptInterface1(), "robot");
将定义了回调方法的对象注入WebView中,这样html5就能通过注入的这个对象调用本地方法。【注入的对象的引用叫 “robot”】
c: 在html5中,如下书写 ,就能调用android本地的方法
<p>
<button onclick="robot. callAndroidMethod()">点击我调用android 方法</button>
</p>
<p>
<button onclick="interface.callFromJSBasicDataType(100,100,'a',true)">callnative method to test basic datatype through javascriptInterface</button>
</p>
d: 要是需要带参数交互那么android 本地代码和 JS中定义的方法可以如下书写:
//------android 代码示例------
public voidcallFromJSBasicDataType(int x,float y,char c,boolean result){
String str ="-"+(x+1)+"-"+(y+1)+"-"+c+"-"+result;
}
public void callAndroidMethod(){
AppUtils.showDialog();
}
//------JS配合上面的android示例如下------
<p>
<buttononclick="robot.callFromJSBasicDataType(100,100,'a',true)">点击我调用android 方法</button>
</p>
2.2 Html5 调用 android 本地方法二
在网页跳转的时候【必须有跳转】,截获跳转地址Url,分析Url从而得知意图。
android 本地通过自定义WebView中使用到的WebClent对象,从而截获跳转地址:
private class CustomWebViewClient extendsWebViewClient {
//重写webclient,从而截获跳转的地址
public boolean shouldOverrideUrlLoading(WebView view, String url) {
//注意,下面的判断就是意图分析
if (url.contains("www.mystore.com.cn")) {
String msg = url;
AppUtils.showAlertDialog(Html5CallNativeFromSelfWebClient.this,msg);
return true;
}
return false;
}
}
3 android 本地方法调用html5
android主要是通过WebView的webView.loadUrl("JavaScript:xxmethod();"); 来调用嵌入html5中的 方法。 例子如下:
a:html5 中 定义一个方法,名叫 "noParamFunction()"
<html>
<head>
<script>
function noParamFunction() {
var component = document.getElementById("noparam_ta");
component.value = component.value + "native button clicked,call js with noparams\n";
}
</script>
</head>
</html>
b: 在android本地:想调用javascript中的noParamFunction方法,如下即可
webView.loadUrl("javascript:noParamFunction();");
4: 再往下就是URL中附加的私有协议了
后端给前端发送数据的约定
1:后端给前端发送的数据整个就是一个网页地址 + ?#myrainbowparams#+ json串 +#myrainbowparams# 的组合结构。
(比如:
http://mystore.com.cn/v1/page/goods_info?#myrainbowprams#{"clientaction":"1","actionid": "100","params": {"bugoodsid": "1000"}}#myrainbowprams#
2:注意:
只有满足下面2个条件前端才会根acitonid 去执行动作
a:h5给的数据中包含#myrainbowprams#
b: clientaction = 1
3:参数说明
clientaction |
TRUE |
string |
是否需要app自己处理H5给的数据。" 0->不需要处理" ; "1-->需要处理" |
|
actionid |
true |
string |
clientaction为0 actionid 填为-1;clientaction为1 actionid填为正常的编号 |
|
params |
TRUE |
jsonobject |
clientaction为0 params 填为null ; clientaction为1 params 正常填写 |
登录:可选
h5给前段的整个数据示例如下:
http://mystore.com.cn/v1/page/goods_info?#myrainbowprams#{
"clientaction": "1",
"actionid": "100",
"params": {
"bugoodsid": "1000"
}
}
#myrainbowprams#
对上面的这些信息前段接收到之后理解如下:
1:前端需要自己处理,而不是简单的利用webkit引擎去进行页面跳转
2:前端需要执行编号为100的动作
3:执行编号为100的动作所需要的参数在params中,有 bugoodsid , 有url 等。。请按照需求取。
源生代码和H5的交互 android:的更多相关文章
- Android中WebView与H5的交互,Native与JS方法互调
项目中经常用到WebView与H5的交互,一个是H5调本地方法,一个是本地调H5方法,在此记录一下. 首先,启用JS支持 //启用js支持 webSettings.setJavaScriptEnabl ...
- Hybrid APP之Native和H5页面交互原理
Hybrid APP之Native和H5页面交互原理 Hybrid APP的关键是原生页面与H5页面直接的交互,如下图,痛过JSBridge,H5页面可以调用Native的api,Native也可调用 ...
- iOS原生APP与H5+JS交互////////////////////zzzz
原生代码中直接加载页面 1. 具体案例 加载本地/网络HTML5作为功能介绍页 2. 代码示例 //本地 -(void)loadLocalPage:(UIWebView*)webView ...
- Webview之H5页面调用android的图库及文件管理
h5页面打开图片管理器 一般页面在pc打开文件管理器是用 type="file"的代码,可是这在android的webview是无效的,必须为webview设定WebChromeC ...
- 浅谈 iOS 与 H5 的交互- JavaScriptCore 框架
前言 小的作为一个iOS程序猿,可能研究JavaScript以及H5相关的知识并不是为了真正的要去转行做这一方面,其实更多的为了要研究OC中的JavaScriptCore框架,JavaScriptCo ...
- 换个视角来看git命令与代码库发生网络交互报错事件
git的一系列命令中像 clone.pull.push等与代码库发生网络交互时,可能报下面的错误信息 fatal: remote error: CAPTCHA required Your Stash ...
- android json解析及简单例子+Android与服务器端数据交互+Android精彩案例【申明:来源于网络】
android json解析及简单例子+Android与服务器端数据交互+Android精彩案例[申明:来源于网络] android json解析及简单例子:http://www.open-open. ...
- [WPF自定义控件库] 自定义控件的代码如何与ControlTemplate交互
1. 前言 WPF有一个灵活的UI框架,用户可以轻松地使用代码控制控件的外观.例设我需要一个控件在鼠标进入的时候背景变成蓝色,我可以用下面这段代码实现: protected override void ...
- Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框
<html> <body> <script> function showAlert(){ alert("JavaScript - hello , worl ...
随机推荐
- leetcode刷题-51N皇后
题目 n 皇后问题研究的是如何将 n 个皇后放置在 n×n 的棋盘上,并且使皇后彼此之间不能相互攻击. 给定一个整数 n,返回所有不同的 n 皇后问题的解决方案. 每一种解法包含一个明确的 n 皇后问 ...
- 完美激活PyCharm教程
1.版本 本文中pycharm版本为PyCharm Professional-2018.3.3,JetbrainsCrack版本为4.2.需要注意,不同版本的pycharm对应的JetbrainsCr ...
- db2官方文档
开局贴链接.这个东西是真坑,下载竟然需要账号... (我就做一下记录,别喷我)
- App测试理论简介
一.App测试常见关注点 1.App的功能测试 功能测试都是我们首要测试的,只有功能实现了才算符合上线发布的最低标准.我们需要检测产品功能是否已实现.产品功能是否符合设计要求.产品功能是否有重复.产品 ...
- java里的锁总结(synchronized隐式锁、Lock显式锁、volatile、CAS)
一.介绍 首先, java 的锁分为两类: 第一类是 synchronized 同步关键字,这个关键字属于隐式的锁,是 jvm 层面实现,使用的时候看不见: 第二类是在 jdk5 后增加的 Lock ...
- springcloud一些博文记录
自己搭建完整demo后看的一个系列博文https://my.oschina.net/u/3375733/following 现在看着这个系列的后期文章估计出差前不会看了 一个博主的系列的git地址和博 ...
- Java审计之文件操作漏洞
Java审计之文件操作漏洞篇 0x00 前言 本篇内容打算把Java审计中会遇到的一些文件操作的漏洞,都给叙述一遍.比如一些任意文件上传,文件下载,文件读取,文件删除,这些操作文件的漏洞. 0x01 ...
- 认证授权:IdentityServer4 - 单点登录
前言 上一篇文章介绍了IdentityServer4的各种授权模式,本篇继续介绍使用IdentityServer4实现单点登录效果. 单点登录(SSO) SSO( Single Sign-On ),中 ...
- Jakartase_IO流_ — Commons IO_(IO流终极篇)
一.前言 Apache Commons IO是Apache基金会创建并维护的Java函数库. 它提供了许多类使得开发者的常见任务变得简单,同时减少重复代码 二.Commons IO 类库 2.1 Fi ...
- 2.Kafka-架构