thinkjs开启csrf示例教程

什么是CSRF?

CSRF(Cross-site request forgery跨站请求伪造,也被称为“One Click Attack”或者Session Riding,通常缩写为CSRF或者XSRF,是一种对网站的恶意利用。。。。详见百度

通俗地讲:就是防止批量、重复地模拟表单提交,达到恶人的目的。所有项目,考虑安全问题,最好所有提交请求都加一下。某公司因为注册时候的短信验证码请求时未加,导致被人利用发送好几万条短信...

thinkjs如何配置?

贴上官方文档提供的配置代码:

开启 CSRF

配置 hook 文件 src/common/config/hook.js,添加如下的配置:

export default {
  logic_before: ["prepend", "csrf"]
}

CSRF 默认的配置如下,可以在配置文件 src/common/config/csrf.js 中修改:
(在 src/common/config下新建csrf.js文件贴上代码)

export default {
  session_name: "__CSRF__", // Token 值存在 session 的名字
  form_name: "__CSRF__", // CSRF 字段名字,从该字段获取值校验
  errno: 400, //错误号
  errmsg: "token error" // 错误信息
};

如此,thinkjs端的配置完成了,注意两个配置项:session_name: "CSRF",和form_name: "CSRF"。

应用场景:

假如后台登录需要添加csrf:
在controller/login.js的session里获取csrf值,并assign到前台页面

  async indexAction(){
      this.assign("title","管理员登陆")
      let csrf=await this.session("__CSRF__");
      this.assign("csrf",csrf);
      //判断是否登陆
            let data=await this.session('userInfo');
            if(think.isEmpty(data)){
                  return  this.display();
                }else{
                  return  this.redirect("/admin/index");
            }
       //判断是否登陆 
  }

这样前台页面就能获取到CSRF的值了
在前台login.html页面里可以弄个隐藏域来放CSRF值

 <form>
   <div class="form-group">
    <label for="username">用户名</label>
    <input type="text" class="form-control" id="username" placeholder="用户名">
   <input type="hidden" id="csrf" value="<%=csrf%>">
 </div>
</form>

然后在前台表单提交的时候,传输的数据添加CSRF参数

$("#loginBtn").on('click', function () {
    $.ajax(
    {
        url: 'http://localhost:8361/login/dologin',

        data: {
            username: $("#username").val(),
            password: $("#password").val(),
            __CSRF__: $("#csrf").val()
        },
        type: 'POST',
        success: function (json) {

            if (json.errno === 0) {

                alert(json.errmsg);

                window.location.href = "/admin/index";
            } else {
                alert(json.errmsg);
            }
        }
    }
    )
})

如此,CSRF的简单应用就完成了。

进阶用法,可以考虑在controller/base.js里统一assign系统的CSRF值,这样所有页面都有了。CSRF值写在前台的公用头部的meta标签里,其他页面<%include inc/header.html%>,然后表单提交的时候获取一下并提交CSRF值。(个人想法)


感谢你的阅读,本文由 前端汇 版权所有。
如若转载,请注明出处:前端汇(//statics.jsout.com/page/124.html)