前端实现登录 -- Token 登录

前言

登录功能几乎是每个项目中必用到的一个功能，今天我就来介绍一下使用Token实现登录功能。让我们来看看输入完账号密码，敲完回车键之后都发生了什么。

Token

Token 是服务端生成的一个字符串，以作为客户端请求的一个令牌。

当第一次登录后，服务器会生成一个 Token 并返回给客户端并由客户端自由保存。

客户端后续访问时，只需带上这个 Token 即可完成身份认证。

Token 机制实现流程

用户首次登录流程：

graph TD
用户 --访问--> xxx.com/index.html
xxx.com/index.html --输入账户密码--> 服务器校验账户密码
服务器校验账户密码 --校验成功--> 生成token
生成token --返回给客户端--> 登录成功
 登录成功 --允许访问--> xxx.com/index.html

后续页面访问流程：

graph TD
用户 --访问--> xxx.com/index.html
xxx.com/index.html --传递token--> 服务器校验token
服务器校验token --有效--> 登录成功
服务器校验token --无效--> 重新登录
 登录成功 --允许访问--> xxx.com/index.html

Token 机制的特点

• Token不需要存放在服务器（因为TokenToken 并不是一串杂乱无章的字符串，而是通过多种算法拼接组合而成的字符串），所以不会对服务器造成压力也不增加维护成本。
• Token 可以存放在前端任何地方，可以不用保存在 Cookie 中，提升了页面的安全性。
• Token 下发之后，只要在生效时间之内，且服务器端不容易收回 Token 的权限。

结语

本文到此结束

如果大家还有什么其他想法，欢迎在评论区交流！