JS与Android的交互
一、函數(shù)交互
交互模型
1、js調(diào)用android原生的代碼（不傳遞參數(shù)）
2、js調(diào)用android原生的代碼（傳遞參數(shù)）
3、android原生調(diào)用JS的代碼（不傳遞參數(shù)）
4、android原生調(diào)用JS的代碼（傳遞參數(shù)）
在工程的main文件夾下創(chuàng)建一個文件夾assets ,然后把寫好的H5頁面放入該文件夾中，H5頁面代碼如下：
<!DOCTYPE html> <html> <head><meta charset="utf-8"/><title>這里是一個H5頁面</title> </head> <body> <p id="ptext">點擊按鍵0</p><button id="buttonId0" class="buttonClass" onclick="javascript:button.click0()">按鍵0</button><p>點擊按鍵1</p><button id="buttonId1" class="buttonClass" onclick="javascript:button.click0('參數(shù)1','參數(shù)2')">按鍵1 </button><script>function setRed(){//var a = document.getElementById('ptext');a.style.backgroundColor="#F00";}function setColor(color, text){var a = document.getElementById('ptext');a.style.backgroundColor = color;a.innerHTML = text;}</script> </body> </html>上邊是一個簡單的H5頁面，其中包含兩個按鈕，點擊按鈕觸發(fā)android 原生的方法；
里邊還有兩個JS 方法，其中也包括兩個函數(shù)，主要用于給android原生去調(diào)用。
下邊的代碼 按鍵0按鈕（無參） 和 按鍵1按鈕（有參） 分別調(diào)用andorid的兩個函數(shù)
//點擊按鍵0 執(zhí)行android中的 public void click0(){} 方法 <button onclick="javascript:button.click0()">按鍵0</button>//點擊按鍵1 執(zhí)行android中的 public void click0(String data1,String data2){}方法 <button onclick="javascript:button.click0('參數(shù)1','參數(shù)2')">按鍵1 </button>android的兩個函數(shù) click0() 和click0(參數(shù)1，參數(shù)2)
public class BtnClick {//H5調(diào)用方法：javascript:button.click0() @JavascriptInterfacepublic void click0() {show("title", "");}//這是 button.click0() 的觸發(fā)事件，可以傳遞待參數(shù) //H5調(diào)用方法：javascript:button.click0('參數(shù)1','參數(shù)2') @JavascriptInterfacepublic void click0(String data1, String data2) {show(data1, data2);}private void show(String title, String data) {Log.e("nan", title + data);}@JavascriptInterface//必須添加，這樣才可以標(biāo)志這個類的名稱是 button public String toString() {return "button";} }通過webview h5和原生相互通信、調(diào)用
val settings = wb.settings settings.javaScriptEnabled = trueval btnClick = BtnClick() wb.addJavascriptInterface(btnClick, btnClick.toString())wb.loadUrl("file:///android_asset/h5.html") //加載assets文件中的H5頁面下邊是android調(diào)用H5函數(shù)的代碼
// 調(diào)用android 無參函數(shù) redBtn.setOnClickListener {wb.loadUrl("javascript:setRed()") }// 調(diào)用android有參函數(shù) colorBtn.setOnClickListener {wb.loadUrl("javascript:setColor('#00f','這是android 原生調(diào)用JS代碼的觸發(fā)事件')") }H5 代碼
function setRed(){//這個方法設(shè)置 id 為 ptext 的元素的背景色為紅色var a = document.getElementById('ptext');a.style.backgroundColor="#F00"; } function setColor(color, text){//這個方法設(shè)置 id 為 ptext 的元素的背景色為指定顏色 //設(shè)置 id 為 ptext 的元素的內(nèi)容為text var a = document.getElementById('ptext');a.style.backgroundColor = color;a.innerHTML = text; }二、地址交互
通過配置 activity中scheme，代碼如下：
H5代碼調(diào)用
<a href='nan://testh5/path?id=10'>點我試試</a>三、保存cookie
在開發(fā)過程中，我們有時會需要讓Android原生 登錄完成之后記錄登錄狀態(tài)，然后在內(nèi)嵌的 H5 頁面也使用當(dāng)前的登錄賬戶，這個時候，我們可以采用 token 的方式，后臺根據(jù) token 方式，去加載對應(yīng)頁面數(shù)據(jù)。
當(dāng) token 失效時，當(dāng)然也就代表了當(dāng)前的用戶的登錄有效期過期了。下面我們來分析下如何將登錄信息保存到cookie，然后讓Android 和 H5 公用這個cookie。
具體操作
步驟一、當(dāng)然是先去登錄，獲取cookie
以HttpURLcollection為例：
步驟二、將cookie同步到WebView中
/*** 將cookie同步到WebView* @param url WebView要加載的url* @param cookie 要同步的cookie* @return true 同步cookie成功，false同步cookie失敗* @Author JPH*/ public static boolean syncCookie(String url,String cookie) {if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {CookieSyncManager.createInstance(context);}CookieManager cookieManager = CookieManager.getInstance();cookieManager.setCookie(url, cookie);//如果沒有特殊需求，這里只需要將session id以"key=value"形式作為cookie即可String newCookie = cookieManager.getCookie(url);return TextUtils.isEmpty(newCookie)?false:true; }如果設(shè)置成功，通過cookieManager.getCookie(url)方法就可取得剛才設(shè)置的cookie，如果兩次設(shè)置cookie的url相同，則CookieManager會將上一次設(shè)置的cookie覆蓋，已達到更新的效果。
提示：
同步cookie要在WebView加載url之前，否則WebView無法獲得相應(yīng)的cookie，也就無法通過驗證。
每次登錄成功后都需要調(diào)用“syncCookie”方法將cookie同步到WebView中，同時也達到了更新WebView的cookie。如果登錄后沒有及時將cookie同步到WebView可能導(dǎo)致WebView拿的是舊的session id和服務(wù)器進行通信。
優(yōu)點：
方便，只需要在登陸后將cookie同步到WebView即可，省去了每次請求都需要設(shè)置一次的繁瑣。
兼容性好，因為是系統(tǒng)原生支持的，所以兼容性自然比方式一要好，不存在cookie被攔截的問題。
分享個返利程序，可以賺點零花錢。
參考：
Android WebView 持久化問題(Cookie保存)
https://blog.csdn.net/qq_34163551/article/details/97642320
h5儲存和cookie儲存
https://blog.csdn.net/zerocher/article/details/72822108
Android在webview上設(shè)置cookie，部分cookie失效的問題
https://blog.csdn.net/zhangyali00/article/details/53158603
總結(jié)
以上是生活随笔為你收集整理的JS与Android的交互的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： PKCS1_RSA
- 下一篇： android实现延时的方法,Andro