How to Use ajax-interceptor
背景简介
- 随着Web应用/网页的不断增加, 随着restful的发展, springboot的实现简单, 以及不注意加密等等因素影响,客户端越来越容易模拟数据
举例:
- pandownload 等通过加载httpClient模拟浏览器登录, 记录Cookie以实现再次打开免登陆的操作
- 修改一些网页展示数据-> 原作者示例
- 前端开发在后台没有做好的时候, 终于不用读取本地json文件.到时候在修改文件了.也不用特地叮嘱后台跨域了, 后台也不用修改跨域的代码了
- 嗯... 还是很鸡肋的
什么是 ajax-interceptor
- 可以拦截页面上的 ajax 请求,并把返回结果替换成任意文本。它对 mock数据、排查一些线上问题等会有很大帮助。(当然 chales 等抓包软件也可以做到,然而使用起来比较繁琐,做成 chrome 插件的形式会方便许多)
实现原理
- 页面加载时往页面上注入 js 代码,这段 js 会生成一个 XMLHttpRequest 的代理对象,并把 window.XMLHttpRequest 替换成这个对象。该对象又会对 onreadystatechange 和 onload 两个回调函数做特殊处理,在它们执行时把 responseText 和 response 的值覆盖为你设置的值。其它就是这段页面上的 js 代码和右侧弹出的 iframe (用户界面)以及插件后台代码的一些数据交互和存储上的实现,这部分比较杂就不介绍了(引用了作者的原话)
作者 ajax-interceptor 的局限性
- 仅适用于单post包含要修改的全部数据(无法仅仅修改部分返回数据)
- 没有办法携带Cookie拦截(即设置任意cookie到本地)
给我们的提示
- 做这种ajax/fetch(前端术语)其实是restful接口的时候, 重要数据一定要进行验证!!!!!!!!!!!!!!!!!!!!!!!!!!
- 验证的方法有以下几种: restful请求中一定要 jwt/cookie/token加密 等等, 注意一定要加时间加密, 这样即使带参传过了时间也会失效
- 验证的原理:
都是通过后台加密, 把加密后的验证串(以下统称token)写到前端, 每次前端请求的时候都带上token-> 到后台验证
所有的前端加密都是不靠谱的
ajax-interceptor 的安装使用教程
最最重要的 - -
- 上面写那么多其实都是废话.....既然你看到这里了, 我就告诉你-> 我的目的其实是去看小电影
小电影上有个post去验证返回结果是false, 不让我看= =, 我就用这个改为了然后可以看了, 然后感觉还不错= =
分享一下...
了解更多看这里