android webview中如何實現html與手機本地資料的互動
阿新 • • 發佈:2019-01-27
在webview開發中,往往不止簡單的載入一個頁面顯示那麼簡單,常常有將手機本地的資料放到html上顯示和將html上操作的資料儲存到手機本地的情況,那麼如何實現這種資料互動呢:
一:webvie部份:
final String json="{title1:孔子,title2:孟子,title3:莊子}";
wv_webview.addJavascriptInterface(new Object() {
//@param message: html頁面傳進來的資料
@JavascriptInterface
public String getLocationData(String message) {
Toast.makeText(MainActivity.this, message, 1).show();
return json; // 把本地資料弄成json串,傳給html
}
}, "MyBrowserAPI");//MyBrowserAPI:自定義的js函式名
wv_webview.loadUrl("file:///android_asset/index.html");
二:html部分:
<title >測試手機和頁面之間的資料傳遞</title>
<script language="javascript">
function showjson(json){
document.getElementById("test").innerHTML=json;
}
function getData(){ //呼叫Android中自定義的拍照JavaScript介面
var json=window.MyBrowserAPI.getLocationData("從頁面傳給手機的message");//拿到本地資料,並可以傳給手機一些內容,可選
showjson(json); //在頁面上顯示出結果
}
</script>
</head>
<body>
<div>
<input value="點我試試" type="button" onclick="getData()"/>
</div>
<div>
<p id="test">沒有資料</p>
</div>
</body>
OK!就是這麼簡單…