這兩天一直在研究WebView加載html檔案,并顯示伺服器端資料得問題,其中很關鍵的一個問題就是需要在java代碼中将從伺服器端接收到的資料,傳遞到WebView的HTML頁面中,并通過JavaScript函數來将資料顯示出來。在檢視了Android的API文檔以後,發現WebView有兩種方式可以和JavaScript做互動。
方式一:
//先加載html檔案,然後調用html檔案中的javascript函數
webView.loadUrl("file:///android_asset/show.html");
webView.loadUrl("javascript:pushNewsData('"+strHtml+"')");
方式二:
//在Java代碼中添加javascript的接口,然後在html檔案中調用java中的對象
webView.addJavascriptInterface(strHtml, "MyContent");
HTML檔案
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8" />
</head>
<body id="myBody">
</body>
<script>
funcion pushNewsDate(dataText){
document.write(dataText);
}
window.MyContent;
</script>
</html>
最後我使用的是第二種方式來顯示從伺服器端得到的資料。也許有朋友會問,為什麼不是用第一種方式,這樣直接調用不是很好麼,為什麼非得兜個圈子,先向WebView發送請求,然後WebView再發送資料到html頁面?
最初,我也覺得第一種方法很直覺,使用起來也很省事,但是在debug的過程中才發現這種調用方式是存在隐患的,什麼隐患呢?因為我是向html頁面傳送從伺服器接收到的資料,這其中有個很難控制的地方——伺服器端發送的資料是什麼樣子的?裡面有沒有非法字元?有沒有特殊字元?發現這個隐患也是很偶然的,因為之前顯示是正常的,可是突然就出現了一次不顯示任何内容的情況,debug時跟蹤了所有地方,也沒有發現代碼中出現問題,最後又将從伺服器端接收到的資料放到HTML頁面中對JavaScript做debug,就這樣折騰了3個多小時,最後才發現是在使用方式一得情況下,将資料當做參數傳入到javascript函數中時,javascript對參數得值不識别造成的,即javascript認為傳入的參數的值是錯誤的。當換成第二種方式後,這個問題就不存在了,無論是什麼樣的資料,都可以在html頁面中正常顯示。
在第二種方式中,本人是将一個字元串“strHtml”當做對象傳入到html頁面中,如果大家希望傳入其他内容也是可以的,比如傳入一個class
public class HtmlShow{
private String str;
public String getContent(){
str = "initialize in java";
return str;
}
}
HtmlShow hs = new HtmlShow();
webView.addJavascriptInterface(hs, "MyContent");
在Html中的調用方式如下
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8" />
</head>
<body id="myBody">
</body>
<script>
window.MyContent.getContent();
</script>
</html>
本文轉自 sw840227 51CTO部落格,原文連結:http://blog.51cto.com/jerrysun/560891,如需轉載請自行聯系原作者