AndroID WebvIEw虽然提供了页面加载及资源请求的钩子,但是对于h5的AJAX请求并没有提供干涉的接口,这意味着我们不能在webvIEw中干涉JavaScript发起的http请求,而有时候我们确实需要能够截获AJAX请求并实现一些功能如:统一的网络请求管理、cookie同步、证书校验、访问控制等。
思路
虽然在 WebvIEw中无法直接拦截 AJAX请求(其实在shouldInterceptRequest 中是可以收到AJAX请求的,但是遗憾的是取不到请求参数,这样也是没有意义的), 我们可以转换思路,能不能在Js中将所有的请求转发到native中,这样也就达到了相同的目的。如果可以,那就需要一种在JavaScript和native之间通信的桥梁(JavaScript brIDge),通过它,JavaScript将请求信息传递给native,native完成真正的请求后再将结果数据传递给JavaScript。那么我们的思路就是:
在JavaScript中拦截所有AJAX请求,然后通过JavaScript brIDge将请求信息传递给native
native收到请求信息后,进行一些与处理逻辑,然后完成本次请求,将请求结果通过JavaScript brIDge再回传给JavaScript.
这样,在第二步native上收到请求信息后,我们就可以进行统一的网络请求管理、cookie同步、证书校验、访问控制。思路虽然简单,但实现起来却是比较麻烦,因为需要前端和native都需要做不少的工作。那么有什么简单的方法吗?当然有!
轮子
fly.Js 是一个支持请求重定向的轻量级、跨平台的JavaScript http请求库 ,前端可以使用它轻松发起网络请求,它会自动将请求转发至native. 现在解决了第一个问题,接下来我们需要选一个JavaScript brIDge,而现在开源的JavaScript brIDge挺多,你可以选择任意一个你喜欢的。但是,在此强烈推荐一下 DSBrIDge 它是一个使用非常简单并支持同步的跨平台JavaScript birdge, 最关键的是, DSBrIDge 的demo中就有接收处理fly.Js转发的http请求的示例,并且给出了okhttp的实现,并且,fly.Js](https://github.com/wendux/fly) 官方也提供了DSBrIDge 的adapter. 下面我们以DSBrIDge为例,演示一下整个过程:
实例
前端
//引入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);//接下来,通过fly发起的AJAX请求都会转发到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对象 //端上完成请求后,将响应对象通过hander返回给fly adapter //hanlder(response) }
fly.Js中dsbrIDge的adapter会调用Native的 onAJAXRequest方法,native只需实现这个方法即可,完整的请求实现可以参照 DSbrIDge demo中 AJAXHandler 的实现.
总结以上是内存溢出为你收集整理的实例详解Android Webview拦截ajax请求全部内容,希望文章能够帮你解决实例详解Android Webview拦截ajax请求所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)