首页  >  文章  >  web前端  >  给裸接口加一道防护,避免恶意盗刷和爬取_html/css_WEB-ITnose

给裸接口加一道防护,避免恶意盗刷和爬取_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-21 08:46:361513浏览

WEB应用是开放的,WEB前端代码也是公开的,和后端交互的接口如果没有经过特殊处理(加密/token),那么就是裸露的,只要知道api地址,那么就能随便获取应用数据。这样应用数据就很容易被人爬取或者恶意盗刷,典型的短信被恶意盗刷。

公司理财产品的短信接口就是一个裸接口,只要手机号就可以任意盗刷,当然背后有根据手机号,ip地址做了请求限制,但还是不够。后面就加了一定时间内一定请求次数的Token,后面观察,基本没有被刷的迹象,说明新的机制还是起到很大作用。当然这个机制不仅是用于防短信盗刷,可用于任意的裸接口防护。

原理很简单,就是在web页面请求的时候由后端按一定的算法注入token到页面中去,然后前端可以通过对应的规则取到token,在请求接口数据时带上去就能在后端对token进行验证,验证通过就能正常请求到数据。如果是native app ,可通过加密的方法请求接口来获取token,最简单直接的方式就是native app 客户端使用一段字符串+时间戳(从后端获取)进行加密,然后请求后端接口,接口对数据进行解密,对时间戳对比,在一段时间内认为有效(避免加密信息被拦截,所以加了时间戳校验),从而获取token。

当然web应用都是公开的,所有源码理论上都是能获取到的。那么后端向web页面注入token的方式也能被破解,所以,后端注入token的形式可定制,比如注入到请求,或者自己实现一套算法,增加被破解的难度。

把这套机制整理成一个独立的npm包 access-token-api,方便多项目复用。

使用例子:

npm install access-token-api//server(nodejs)  端var accessTokenApi = require('access-token-api');var TokenApi = new accessTokenApi({    webTokenVarName:'encrypt_api_tokenStr',//前端可通过webTokenVarName变量去到token值,默认encrypt_api_tokenStr});//web前端取token值window[webTokenVarName] //请求接口时带上这个值就能进行token校验了

主要接口

生成token api issue验证token api verifytoken 有效次数减一 api declineserver 端 将token 注入到 web 前端页面 api webInject

自定义后端注入token到web前端页面的方式,可以初始化模块时自定义webInject参数(函数)

var TokenApi = new accessTokenApi({    webInject:function(html,token,callback){    var htmlEndIndex = html.indexOf('</html>');      var tokenScript = '<script>window.' + this.config.webTokenVarName + '=' + token + '</script>';      var prevHtml = html.substring(0,htmlEndIndex);      var nextHtml = html.substr(htmlEndIndex);       prevHtml += tokenScript;      prevHtml += nextHtml;      callback(null,prevHtml);    }});

项目地址 https://github.com/navyxie/access-token-api,里面有express和sails框架的使用例子,抛砖引玉。

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn