在上一次的内容中,我们已经成功实现了用户的登录功能,通过对用户管理模块中添加的用户账号进行账号和密码的验证,确保了用户身份的安全性。为了进一步提升系统的安全性,我们采用了图形验证码的方式,强制进行人机交互,有效防止了账号和密码被暴力破解的风险。在接下来的内容中,我们将进一步探讨如何为登录成功的用户生成Token,并通过Iris框架的中间件(Middleware)进行鉴权操作。
在生成Token之前,我们需要对项目的模板进行一系列的优化和改造。目前项目中存在的页面模板有三块,分别是首页模板(index.html)、登录页模板(signin.html)以及后台用户管理页模板(/admin/user.html)。虽然页面的数量并不算多,但从代码的角度来看,我们可以发现存在大量的重复代码。例如,首页模板和登录页模板都包含了公共的头部导航菜单,如果每个模板都重复编写相同的代码,将会导致代码的冗余和维护难度增加。此外,三块模板中都包含了axios的封装逻辑,同样没有必要进行重复的封装。除此之外,随着项目的发展,如果模板数量不断增加,而不进行模板的复用,将会导致维护的难度进一步加大。
首先,我们需要提取页面模板中的公共部分,例如头部导航。我们可以在views目录下建立一个header.html文件,将公共的头部导航代码提取出来。
接下来,在需要头部导航的模板中进行引入操作,例如修改signin.html文件。
需要注意的是,为了防止与前端Vue.js标签的冲突,我们在模板中使用${}进行标记。
同样地,我们将封装axios.js的逻辑单独抽取出来,形成一个myaxios.html文件。
然后,在需要的地方进行引入操作。
通过以上步骤,我们只需要维护模板的公共部分,从而简化了模板的管理和维护工作。
修改后,项目的结构如下:
JSON Web Token (JWT)是一个互联网应用的开放标准(RFC 7519),它提供了一种紧凑且自包含的方式,用于在各方之间安全地传输JSON对象。这种信息可以被验证和信任,因为它是经过数字签名的。
简单来说,当用户登录成功后,系统会生成一个JSON对象,并将其返回给前端。这个JSON对象包含了用户的相关信息。之后,当用户与服务端进行通信时,所有请求都需要携带这个JSON对象。服务器通过这个对象来识别用户的身份。为了防止JSON对象被篡改,服务器在生成这个对象时会加上签名,使其变成一种特定的格式。
这就是我们通常所说的Token,也可以理解为“令牌”。
在我们的项目中,为了登录校验通过的账号生成Token,首先需要安装jwt包:
随后,我们需要修改本地的工具包mytool.jwt文件:
众所周知,Token由三部分组成:头部、载荷以及秘钥。这里的SigKey字符代表签名秘钥,PlayLoad结构体代表载荷信息。通过签名生成一个字符格式的token,需要注意的是,返回前端时,需要将token强转为字符串格式。
需要注意的是,生成签名时使用的是HS256算法,同时为了确保安全性,token设置了生命周期,这里为50分钟。
随后,我们需要修改用户登录逻辑,将生成好的token返回给前端:
前端接收到的返回值为:
随后,前端收到token后,将其存储在localstorage中,然后跳转到后台页面:
localStorage存储是永久的,如果对安全性要求较高,可以采用sessionStorage,token的生命周期就会跟随浏览器进程,但之前设置的token生命周期就没有意义了,各有利弊,需要根据实际情况进行权衡。
所谓中间件,是一类提供系统软件和应用软件之间连接、便于软件各部件之间沟通的软件,应用软件可以借助中间件在不同的技术架构之间共享信息与资源。
简单来说,就是在所有需要鉴权的接口前面加一层逻辑,便于批量管理和控制:
这里声明中间件变量verifyMiddleware,该变量会返回一个载荷结构体对象。
随后,为所有的后台接口、包括后台模板添加中间件:
如此,所有后台操作都需要中间件的鉴权操作。

换句话说,如果请求地址中没有token或者token不合法,就不会返回正常数据。
访问:http://localhost:5000/admin/user 如图所示:
如果带着token:
当然了,之后所有的后台请求都需要携带token,所以改造上面封装的myaxios.html:
藉此,每个后端请求都会携带token。
JWT形式的认证体系将用户状态分散到了客户端中,相比于服务端的session存储,可以明显减轻服务端的内存压力。此外,使用Iris中间件鉴权的方式有助于提高代码的重用性,也更便于维护,更加优雅。该项目已开源在Github:https://github.com/zcxey2911/IrisBlog ,与君共觞,和君共勉。