第一步：打开gitup网站:https://github.com/explore
输入：jsbridge，点击lzyzsd/JsBridge
点击download zip:
解压：我们需要的是library文件夹，其他的不需要
打开library文件夹，将com文件夹复制，并粘贴到你的android项目文件夹中的 src文件夹 中：
将WebViewJavascriptBridge.js复制，并粘贴到你的android项目文件夹中的 assets文件夹 中：
第二步：打开eclipse中的该项目中的 com.github.lzyzsd.jsbridge包，
程序会报错，不用紧张，按照提示处理就行，
有一个地方是按照提示处理也解决不了的，你就删除掉这行代码，
第三步：打开activity_main.xml，如图将webview控件换成<com.github.lzyzsd.jsbridge.BridgeWebView />
第四步：打开MainActivity.java
创建私有对象：private BridgeWebView mWebView;
private CallBackFunction mFunction;
还有静态网页地址：private String webUrl = "file:///android_asset/test.html";
还有静态常量：private static final int NONE = 0;
private static final int REQUEST_ALBUM =1; // 相册
private static final String IMAGE_TYPE = "image/*";//文件类型
创建两个类，他们分别继承了BridgeWebViewClient和DefaultHandler，如下：
//继承
class MyWebViewClient extends BridgeWebViewClient {
public MyWebViewClient(BridgeWebView webView) {
super(webView);
}
}
//继承
class MyHandlerCallback extends DefaultHandler {
@Override
public void handler(String data, CallBackFunction function) {
super.handler(data, function);
if (null != function) {
showToast(data);
function.onCallBack("收到JS消息回复!");
}
}
}
初始化mWebView，如下：
mWebView=(BridgeWebView)findViewById(R.id.webView);
mWebView.setWebViewClient(new MyWebViewClient(mWebView));
mWebView.setDefaultHandler(new MyHandlerCallback());
mWebView.setWebChromeClient(new WebChromeClient());
//加载服务器网页或者本地网页
mWebView.loadUrl(webUrl);
JSListner();
}
在oncreate函数中写入： initWebView();
我自己在oncreate函数外面写的JSListner()方法，作用是是监听和接收（从网页端发来的）信息，
其中的
mWebView.registerHandler("（标记名称"submitFromJs"，与网页中的window.WebViewJavascriptBridge.callHandler方法中的标记名称必须相同"）“ ,
（你可以在回调函数BridgeHandler() 里面写处理信息的代码，比如调用相册的代码段）);
如下：
public void JSListner(){
//data接收数据，CallBackFunction发送信息
mWebView.registerHandler("submitFromJs", new BridgeHandler() {
public void handler(String data, CallBackFunction function) {
/*将回调函数化为全局函数，此处跟网页的自动刷新有关，就是在上传图片完成后的代码处，写上mFunction.onCallBack("刷新啦！");，就可以发送信息给网页，告诉网页自动刷新，即在网页的js代码中写：if(responseData=="刷新啦！"){window.location.reload();}*/
mFunction=function;
//调用系统相册
CallAndroidAlbum();
showToast("js传来的值"+data);
}
});
}
调用系统相册的CallAndroidAlbum方法，如下：
private void CallAndroidAlbum(){
// 从相册获取图片
Intent intent = new Intent(Intent.ACTION_GET_CONTENT, null);
intent.setDataAndType(MediaStore.Images.Media.EXTERNAL_CONTENT_URI,IMAGE_TYPE);
startActivityForResult(intent, REQUEST_ALBUM);
}
}
onActivityResult方法
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
if (resultCode == NONE){
showToast("resultCode == NONE");
return;
}
if(requestCode == REQUEST_ALBUM){
Uri uri= data.getData();
mFunction..onCallBack(uri);//把图片的uri即网络资源唯一标识符，发送给网页
}
super.onActivityResult(requestCode, resultCode, data);
}
private void showToast(String string) {
Toast.makeText(MainActivity.this, string, Toast.LENGTH_SHORT).show();
}
第五步：打开静态网页file:///android_asset/test.html,写入 window.WebViewJavascriptBridge.callHandler方法
如下：
<script>
function TestClick(){
window.WebViewJavascriptBridge.callHandler(
'submitFromJs'
, {'Data':"发到android端"} , //发送到android端的数据，该类型是任意类型
,function(responseData) {//接收android端发来的信息
document.getElementById("pic").src = responseData;
}
)
}
</script>
//显示图片
<p><inputtype="button"value="打开相册"onclick="TestClick();"/></p>
<imgid="pic"src=""width="100%"height="auto"/>
废话不多说，结束了！如果合意的话请关注，谢谢。