您好，很高興能幫助您，
創(chuàng)新互聯(lián)主營(yíng)鞏義網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,app軟件開(kāi)發(fā),鞏義h5微信小程序搭建,鞏義網(wǎng)站營(yíng)銷推廣歡迎鞏義等地區(qū)企業(yè)咨詢
Android中webview和js之間的交互
1.android中利用webview調(diào)用網(wǎng)頁(yè)上的js代碼。
Android 中可以通過(guò)webview來(lái)實(shí)現(xiàn)和js的交互，在程序中調(diào)用js代碼，只需要將webview控件的支持js的屬性設(shè)置為true，，然后通過(guò)loadUrl就可以直接進(jìn)行調(diào)用，如下所示：
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.loadUrl("javascript:test()");
2. 網(wǎng)頁(yè)上調(diào)用android中java代碼的方法
在網(wǎng)頁(yè)中調(diào)用java代碼，需要在webview控件中添加javascriptInterface。如下所示：
mWebView.addJavascriptInterface(new Object() {
public void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
Toast.makeText(Test.this, "測(cè)試調(diào)用java", Toast.LENGTH_LONG).show();
}
});
}
}, "demo");
在網(wǎng)頁(yè)中，只需要像調(diào)用js方法一樣，進(jìn)行調(diào)用就可以
div id='b'a onclick="window.demo.clickOnAndroid()"b.c/a/div
3. Java代碼調(diào)用js并傳參
首先需要帶參數(shù)的js函數(shù)，如function test(str)，然后只需在調(diào)用js時(shí)傳入?yún)?shù)即可，如下所示：
mWebView.loadUrl("javascript:test('aa')");
4.Js中調(diào)用java函數(shù)并傳參
首先一樣需要帶參數(shù)的函數(shù)形式，但需注意此處的參數(shù)需要final類型，即得到以后不可修改，如果需要修改其中的值，可以先設(shè)置中間變量，然后進(jìn)行修改。如下所示：
mWebView.addJavascriptInterface(new Object() {
public void clickOnAndroid(final int i) {
mHandler.post(new Runnable() {
public void run() {
int j = i;
j++;
Toast.makeText(Test.this, "測(cè)試調(diào)用java" + String.valueOf(j), Toast.LENGTH_LONG).show();
}
});
}
}, "demo");
然后在html頁(yè)面中，利用如下代碼div id='b'a onclick="window.demo.clickOnAndroid(2)"b.c/a/div，
即可實(shí)現(xiàn)調(diào)用
你的采納是我前進(jìn)的動(dòng)力，還有不懂的地方，請(qǐng)你繼續(xù)“追問(wèn)”！
如你還有別的問(wèn)題，可另外向我求助；答題不易，互相理解，互相幫助！
在Android的開(kāi)發(fā)過(guò)程中、遇到一個(gè)新需求、那就是讓Java代碼和Javascript代碼進(jìn)行交互、在IOS中實(shí)現(xiàn)起來(lái)很麻煩、而在Android中相對(duì)來(lái)說(shuō)容易、Android對(duì)這種交互進(jìn)行很好的封裝、其實(shí)可以很簡(jiǎn)單的用Java代碼調(diào)用WebView中的js函數(shù)、也可以用WebView中的js來(lái)調(diào)用Android應(yīng)用中的Java代碼
一、網(wǎng)頁(yè)的JS代碼調(diào)用ANDROID中JAVA代碼的方法
在網(wǎng)頁(yè)中調(diào)用java代碼、需要在webview控件中添加javascriptInterface
contentWebView = (WebView) findViewById(R.id.webview);
//啟用javascript
contentWebView.getSettings().setJavaScriptEnabled(true);
contentWebView.addJavascriptInterface(this, "js對(duì)象名");
在Activity中定義一個(gè)要被js調(diào)用的方法、src為js傳遞過(guò)來(lái)的參數(shù)、如果沒(méi)有不傳也可以的。
public void jsFunction(final String str) {
Toast.makeText(this, str, Toast.LENGTH_SHORT).show();
runOnUiThread(new Runnable() {
@Override
public void run() {
//在里對(duì)Android應(yīng)用的UI進(jìn)行處理
}
});
}
在網(wǎng)頁(yè)中、只需要像調(diào)用js方法一樣、進(jìn)行調(diào)用就可以
a onClick="window.js對(duì)象名.jsFunction(′hello world′)"
點(diǎn)擊調(diào)用java代碼并傳遞參數(shù)
/a
二、ANDROID中JAVA代碼調(diào)用網(wǎng)頁(yè)的JS代碼的方法
Java代碼調(diào)用js并傳參其實(shí)是通過(guò)WebView的loadUrl方法去調(diào)用的、只是參數(shù)url的寫(xiě)法不一樣
// 無(wú)參數(shù)調(diào)用
contentWebView.loadUrl("javascript:javacalljs()");
// 傳遞參數(shù)調(diào)用
contentWebView.loadUrl("javascript:javacalljswithargs("
+ "′hello world′" + ")");
三、JAVA和JS交互注意事項(xiàng)
1、Java 調(diào)用 js 里面的函數(shù)、效率并不是很高、估計(jì)要200ms左右吧、做交互性很強(qiáng)的事情、這種速度很難讓人接受、而js去調(diào)Java的方法、速度很快、50ms左右、所以盡量用js調(diào)用Java方法
2、Java 調(diào)用 js 的函數(shù)、沒(méi)有返回值、調(diào)用就控制不到
3、Js 調(diào)用 Java 的方法、返回值如果是字符串、你會(huì)發(fā)現(xiàn)這個(gè)字符串是 native 的、轉(zhuǎn)成 locale 的才能正常使用、使用 toLocaleString() 函數(shù)就可以、不過(guò)這個(gè)函數(shù)的速度并不快、轉(zhuǎn)化的字符串如果很多、將會(huì)很耗費(fèi)時(shí)間
4、網(wǎng)頁(yè)中盡量不要使用jQuery、執(zhí)行起來(lái)需要5-6秒、最好使用原生的js寫(xiě)業(yè)務(wù)腳本、以提升加載速度、改善用戶體驗(yàn)
一、對(duì)于Android和ios我們要執(zhí)行不同的操作，下面是判斷系統(tǒng)的js代碼
// alert(ismobile(1)); 1表示Android，0表示ios
function ismobile(test){
var u = navigator.userAgent, app = navigator.appVersion;
if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
if(window.location.href.indexOf("?mobile")lt;0){
try{
if(/iPhone|mac|iPod|iPad/i.test(navigator.userAgent)){
return '0';
}else{
return '1';
}
}catch(e){}
}
}else if( u.indexOf('iPad') gt; -1){
return '0';
}else{
return '1';
}
}
二、js調(diào)用app端函數(shù)，下面是js代碼
if(ismobile(1)==1){
Android.setTypeActivity(id,type,href);
}else{
jsToios(id,type,href);
}
setTypeActivity是Android端定義的函數(shù)，jsToios是ios端定義的函數(shù)，括號(hào)里是js端傳遞的參數(shù)。
三、至于js端怎樣獲取app端的數(shù)據(jù)，只需在js端提供給app端函數(shù)名字，在通知app端調(diào)用即可
四、還有一種方法可以不通過(guò)app的方法將數(shù)據(jù)傳遞給另一個(gè)頁(yè)面，那就是通過(guò)URL的方式
在本頁(yè)面將數(shù)據(jù)拼接在ip后面
在另外一個(gè)頁(yè)面通過(guò)下面方法獲取URL后的參數(shù)
function GetRequest() {
var url = location.search; //獲取url中"?"符后的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("");
for(var i = 0; i strs.length; i ++) {
theRequest[strs[i].split("=")[0]]=decodeURIComponent(strs[i].split("=")[1]);
}
}
return theRequest;
}
// 獲取URL參數(shù)
var Request = new Object();
Request = GetRequest();
var name;
name = Request['name'];
移動(dòng)開(kāi)發(fā)中，我們經(jīng)常會(huì)遇到混合開(kāi)發(fā)模式，經(jīng)常是在移動(dòng)客戶端中增加網(wǎng)頁(yè)，來(lái)減少客戶端的壓力，同時(shí)也讓軟件更加靈活。廢話少說(shuō)，下面直接進(jìn)入主題。
webView.getSettings().setAppCachePath(getCacheDir().getAbsolutePath());
webView.getSettings().setAppCacheEnabled(true);
if (Constant.DEBUG) {
webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
}
if (Build.VERSION.SDK_INT = Build.VERSION_CODES.LOLLIPOP) {
webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}
//參數(shù)1 定義Android 與js交互的接口， 參數(shù)2 與js交互的一個(gè)常量，可以是任意一個(gè)常量字符串，
但是h5網(wǎng)頁(yè)調(diào)用的時(shí)候需要增加這個(gè)參數(shù)二：handler
public class JSInterface{
@JavascriptInterface//這個(gè)標(biāo)注必須加上 表示js要調(diào)用的方法，可以自動(dòng)識(shí)別
public void getShareInfo(String strings) {
//todo android dosomething
}
}
那么 js端該如何調(diào)用這個(gè)方法呢\
android 和ios的調(diào)用方法不一樣 因此 h5里面需要區(qū)別andorid和ios機(jī)型來(lái)分別調(diào)用移動(dòng)端方法
如android：
//handler 是與android 約定的常量（最好做成全局通用的常量）
//getShareInfo 是與android 定義的調(diào)用方法
以上常量、方法、參數(shù)類型 必須一致才能成功調(diào)用
WebView提供兩個(gè)事件回調(diào)類給應(yīng)用層，分別為WebViewClient,WebChromeClient開(kāi)發(fā)者可以繼承
這兩個(gè)類，接手相應(yīng)事件處理。WebViewClient 主要提供網(wǎng)頁(yè)加載各個(gè)階段的通知，比如網(wǎng)頁(yè)開(kāi)始
加載onPageStarted，網(wǎng)頁(yè)結(jié)束加載onPageFinished等；WebChromeClient主要提供網(wǎng)頁(yè)加載過(guò)程
中提供的數(shù)據(jù)內(nèi)容，比如返回網(wǎng)頁(yè)的title,favicon等。
有需要監(jiān)聽(tīng)加載網(wǎng)頁(yè)進(jìn)度
//需要webBar的可以自定義增加一個(gè)webBar
最后，就是大家都知道的webView.loadUrl(url);//url需要加載的網(wǎng)頁(yè)
那么，如何在android調(diào)用js的方法呢
//getMsg() 為js里面暴露的方法
在銷毀的時(shí)候：
protected void onDestroy() {\
super.onDestroy();\
if (webView != null) {\
webView.loadUrl("about:blank");\
webView.destory();\
}\
}
Android的webview是基于webkit內(nèi)核的,webview中集成了js與java互調(diào)的接口函數(shù),通過(guò)addJavas criptInterface方法,可以將Java的類注冊(cè)進(jìn)webkit,給網(wǎng)頁(yè)上的js進(jìn)行調(diào)用,而且還可以通過(guò)loadUrl方法是給webkit傳遞一個(gè)URL,供瀏覽器來(lái)進(jìn)行解析,實(shí)現(xiàn)Java和js交互。要想運(yùn)行網(wǎng)頁(yè)上的js腳本,webview必須設(shè)置支持Javas cript。Java代碼1mWebview.getSettings().setJavas criptEnabled(true);然后是設(shè)置webview要加載的網(wǎng)頁(yè):web的網(wǎng)頁(yè):webView.loadUrl("");本地的網(wǎng)頁(yè):webView.loadUrl(""); //本地的存放在:assets文件夾中webview做完基本的初始化后我們還要要給它,加進(jìn)一個(gè)回調(diào)的代理類Javas criptInterface,并給它一個(gè)調(diào)用的名稱:ncpJava代碼1mWebView.addJavas criptInterface(new Javas criptInterface(),"ncp");Javas criptInterface可以是一個(gè)普通的Java類,類實(shí)現(xiàn)的方法,均可被js回調(diào):Java代碼final class Javas criptInterface {public int callOnJs() {return 1000;}public void callOnJs2(String mode) {//TODO}}Java要調(diào)用js的方法,只需知道js的方法名稱即可:Java代碼1mWebView.loadUrl("javas cript:onSaveCallback()");js 這邊就更簡(jiǎn)單:Js代碼window.onload = function(){document.getElementById('btn_1').addEventListener('click', onBtnClick, false);var _int_value = window.ncp.callOnJs();alert("get int from java:" + _int_value );}function onBtnClick() {window.ncp.callOnJs2("click");}
Android和ios都是用navtive語(yǔ)言編寫(xiě)的app，那么調(diào)用js的方法如下：
Native 調(diào)用 JS:
本質(zhì)就一個(gè)方法,通過(guò) stringByEvaluatingJavaScriptFromString,都是同步。
1.通常方法：js修通過(guò)改doucument的loaction或者新建一個(gè)看不見(jiàn)的iFrame,修改它的 src,就會(huì)觸發(fā)回調(diào) webView 的 shouldStartLoadWithRequest,參數(shù) request 的 url 就是新賦值的 location 或者 url,上層截獲這個(gè) url 的參數(shù),對(duì)此分發(fā)即可。 這個(gè)都是異步調(diào)用的。
如 JS function：
var messagingIframe;
messagingIframe = document.createElement('iframe');
messagingIframe.style.display = 'none';
document.documentElement.appendChild(messagingIframe);
function TestIOSJS(){
messagingIframe.src = "ios/test/click";
};
當(dāng)觸發(fā)上面的JS時(shí)，webview會(huì)收到下面的回調(diào)：
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSString *url = request.URL.absoluteString;
if([url hasSuffix:@"ios/test/click"]){
//do something you want
return NO;
}
return YES;
}
通過(guò)截獲這個(gè)request的參數(shù)就可以做native需要做的事情。
重慶分公司
重慶分公司
