Ajax拦截器的实现

个人觉得编程和下棋类似,卡位非常重要。一开始占据着有利的位置,当你在面对变化的时候就会非常灵活。编程中的卡位就是将一些关键的地方预留好,方便以后扩展。比如前端开发中的全局的事件代理,核心组件的基类设计,ajax拦截器等。

最近在做一个ajax加密的需求,就是所有ajax请求的参数都需要经过加密,防止他人盗用api。如果有ajax拦截器,这个需求实现会非常简单,只需要在拦截器里面实现加密即可。第一期,我们利用前端框架本身的ajax拦截器,完成了http加密,一切都很顺利。后续的第二期则遇个麻烦事情,我们需要对所有的前端工程(webvie、管理后台、活动…)进行加密,这些工程都是独立工程,而且使用的框架也不太一样。这就意味着我们第一期的加密代码很难被重用。

怎么办?我们想到了从更底层的XMLHttpRequest上去做文章,如果能在这层做掉,则和上层使用的框架无关了。即使跨越多个工程,也可以使用同一套加密方法。

经过调研window.XMLHttpRequest是可以被覆盖的。如果我们能包装一个和XMLHttpRequest一摸一样的构造器来覆盖原有的,则问题就解决了。经调研,几乎所有前端框架或库在做ajax特性检测时,会首先尝试使用XMLHttpRequest。那么在ie下,我们也可以将ActiveXObject包装成一个XMLHttpRequest。

该实现已经作为一个开源的小js库发布了。浏览器可以兼容到ie6+,若有类似的需求可以直接使用。代码总共不到200行,详情可以戳 https://github.com/vinnyguitar/xhr-overwrite。欢迎一起讨论,改进。

    原文作者:crossea
    原文地址: https://segmentfault.com/a/1190000005054143
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞