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:的更多相关文章

  1. Android中WebView与H5的交互,Native与JS方法互调

    项目中经常用到WebView与H5的交互,一个是H5调本地方法,一个是本地调H5方法,在此记录一下. 首先,启用JS支持 //启用js支持 webSettings.setJavaScriptEnabl ...

  2. Hybrid APP之Native和H5页面交互原理

    Hybrid APP之Native和H5页面交互原理 Hybrid APP的关键是原生页面与H5页面直接的交互,如下图,痛过JSBridge,H5页面可以调用Native的api,Native也可调用 ...

  3. iOS原生APP与H5+JS交互////////////////////zzzz

    原生代码中直接加载页面 1.    具体案例 加载本地/网络HTML5作为功能介绍页 2.    代码示例 //本地 -(void)loadLocalPage:(UIWebView*)webView ...

  4. Webview之H5页面调用android的图库及文件管理

    h5页面打开图片管理器 一般页面在pc打开文件管理器是用 type="file"的代码,可是这在android的webview是无效的,必须为webview设定WebChromeC ...

  5. 浅谈 iOS 与 H5 的交互- JavaScriptCore 框架

    前言 小的作为一个iOS程序猿,可能研究JavaScript以及H5相关的知识并不是为了真正的要去转行做这一方面,其实更多的为了要研究OC中的JavaScriptCore框架,JavaScriptCo ...

  6. 换个视角来看git命令与代码库发生网络交互报错事件

    git的一系列命令中像 clone.pull.push等与代码库发生网络交互时,可能报下面的错误信息 fatal: remote error: CAPTCHA required Your Stash ...

  7. android json解析及简单例子+Android与服务器端数据交互+Android精彩案例【申明:来源于网络】

    android json解析及简单例子+Android与服务器端数据交互+Android精彩案例[申明:来源于网络] android json解析及简单例子:http://www.open-open. ...

  8. [WPF自定义控件库] 自定义控件的代码如何与ControlTemplate交互

    1. 前言 WPF有一个灵活的UI框架,用户可以轻松地使用代码控制控件的外观.例设我需要一个控件在鼠标进入的时候背景变成蓝色,我可以用下面这段代码实现: protected override void ...

  9. Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框

    <html> <body> <script> function showAlert(){ alert("JavaScript - hello , worl ...

随机推荐

  1. Wampserver报错、橙色、mysql打不开

    Wampserver下的几个常见的问题 最近在弄Wampserver,发现有几个问题存留在这里,今天就来解决一下吧 首先就是关于报错的这个一个问题: 第二就是关于一直不变绿的原因 关于报错: 在我的电 ...

  2. leetcode刷题-88.合并两个有序数组

    题目 给你两个有序整数数组 nums1 和 nums2,请你将 nums2 合并到 nums1 中,使 nums1 成为一个有序数组. 说明: 初始化 nums1 和 nums2 的元素数量分别为 m ...

  3. Python 字符串去除相邻重复的元素

    1 def quchong(S): 2 str1=[""] 3 for i in S: 4 if i == str1[-1]: 5 str1.pop() 6 else: 7 str ...

  4. 关于LLVM源码在Linux下编译的过程

    1. 最好在gitee上查找llvm的源码或者直接git clone https://gitee.com/uniquesquirrel/llvm-project.git,是和github上的llvm项 ...

  5. [CF664A]Complicated GCD(数论)

    题目链接 http://codeforces.com/problemset/problem/664/A 题意 给两个数,找出它们的最大公因子d,使得从a到b之间的数都可以整除d. 题解 结论: 当gc ...

  6. 虚虚实实,亦假亦真的 ValueTuple,绝对能眩晕你

    一:背景 1. 讲故事 前几天在写一个api接口,需要对衣物表进行分页查询,查询的output需要返回两个信息,一个是 totalCount,一个是 clothesList,在以前我可能需要封装一个 ...

  7. matlab数字图像简单的加密方法

    图像加密的重要性可想而知,每个人都会有自己的小秘密,通过图像加密的方法可以保护自己的照片等的安全. 一般情况下,图像加密可以分为以下几个步骤: 1.选择图像加密算法 2.根据算法获取秘钥 3.根据保存 ...

  8. oh-my-zsh超级终端

    _ _ ___ | |__ _ __ ___ _ _ _______| |__ / _ \| '_ \ _____| '_ ` _ \| | | |____|_ / __| '_ \ | (_) | ...

  9. ERP与EHR系统的恩怨纠葛--开源软件诞生13

    ERP中需要EHR的存在吗--第13篇 用日志记录"开源软件"的诞生 [点亮星标]----祈盼着一个鼓励 博主开源地址: 码云:https://gitee.com/redragon ...

  10. breakpad系列(1)——起步

    原文来自breakpad目录中doc目录下的getting_started_with_breakpad文档,建议去看原文! 介绍 Breakpad是一个比Linux core机制更强大的.用于记录程序 ...