Android Webview雖然提供了頁(yè)面加載及資源請(qǐng)求的鉤子，但是對(duì)于h5的ajax請(qǐng)求并沒(méi)有提供干涉的接口，這意味著我們不能在webview中干涉javascript發(fā)起的http請(qǐng)求，而有時(shí)候我們確實(shí)需要能夠截獲ajax請(qǐng)求并實(shí)現(xiàn)一些功能如：統(tǒng)一的網(wǎng)絡(luò)請(qǐng)求管理、cookie同步、證書校驗(yàn)、訪問(wèn)控制等。

思路

雖然在 Webview中無(wú)法直接攔截 ajax請(qǐng)求（其實(shí)在shouldInterceptRequest 中是可以收到ajax請(qǐng)求的，但是遺憾的是取不到請(qǐng)求參數(shù)，這樣也是沒(méi)有意義的）， 我們可以轉(zhuǎn)換思路，能不能在js中將所有的請(qǐng)求轉(zhuǎn)發(fā)到native中，這樣也就達(dá)到了相同的目的。如果可以，那就需要一種在javascript和native之間通信的橋梁（javascript bridge），通過(guò)它，javascript將請(qǐng)求信息傳遞給native, native完成真正的請(qǐng)求后再將結(jié)果數(shù)據(jù)傳遞給javascript。那么我們的思路就是：

在javascript中攔截所有ajax請(qǐng)求，然后通過(guò)javascript bridge將請(qǐng)求信息傳遞給native
native收到請(qǐng)求信息后，進(jìn)行一些與處理邏輯，然后完成本次請(qǐng)求，將請(qǐng)求結(jié)果通過(guò)javascript bridge再回傳給javascript.
這樣，在第二步native上收到請(qǐng)求信息后，我們就可以進(jìn)行統(tǒng)一的網(wǎng)絡(luò)請(qǐng)求管理、cookie同步、證書校驗(yàn)、訪問(wèn)控制。思路雖然簡(jiǎn)單，但實(shí)現(xiàn)起來(lái)卻是比較麻煩，因?yàn)樾枰岸撕蚽ative都需要做不少的工作。那么有什么簡(jiǎn)單的方法嗎？當(dāng)然有！

輪子

fly.js 是一個(gè)支持請(qǐng)求重定向的輕量級(jí)、跨平臺(tái)的Javascript http請(qǐng)求庫(kù) ，前端可以使用它輕松發(fā)起網(wǎng)絡(luò)請(qǐng)求，它會(huì)自動(dòng)將請(qǐng)求轉(zhuǎn)發(fā)至native. 現(xiàn)在解決了第一個(gè)問(wèn)題，接下來(lái)我們需要選一個(gè)javascript bridge, 而現(xiàn)在開源的javascript bridge挺多，你可以選擇任意一個(gè)你喜歡的。但是，在此強(qiáng)烈推薦一下 DSBridge 它是一個(gè)使用非常簡(jiǎn)單并支持同步的跨平臺(tái)javascript birdge， 最關(guān)鍵的是， DSBridge 的demo中就有接收處理fly.js轉(zhuǎn)發(fā)的http請(qǐng)求的示例，并且給出了okhttp的實(shí)現(xiàn)，并且，fly.js](https://github.com/wendux/fly) 官方也提供了DSBridge 的adapter. 下面我們以DSBridge為例，演示一下整個(gè)過(guò)程：

實(shí)例

前端

//引入dsbridge adaptervar adapter = require("flyio/dist/npm/adapter/dsbridge")var EngineWrapper = require("flyio/dist/npm/engine-wrapper")var dsEngine = EngineWrapper(adapter)var fly = new Fly(dsEngine);//接下來(lái)，通過(guò)fly發(fā)起的ajax請(qǐng)求都會(huì)轉(zhuǎn)發(fā)到native上fly.post('/user', {  name: 'Doris',  age: 24  phone:"18513222525" }) .then(function (response) {  console.log(response); }) .catch(function (error) {  console.log(error); });

Native端

 @JavascriptInterface public void onAjaxRequest(JSONObject jsonObject, final CompletionHandler handler){  //jsonObject 為fly adapter 傳給端的requerst對(duì)象  //端上完成請(qǐng)求后，將響應(yīng)對(duì)象通過(guò)hander返回給fly adapter  //hanlder(response) }

fly.js中dsbridge的adapter會(huì)調(diào)用Native的 onAjaxRequest方法，native只需實(shí)現(xiàn)這個(gè)方法即可，完整的請(qǐng)求實(shí)現(xiàn)可以參照 DSbridge demo中 AjaxHandler 的實(shí)現(xiàn).