web开发模式
1.基于服务端渲染的传统web开发模式
概念:服务器发送给客户端的HTML页面,是在服务器通过字符串的拼接,动态生成的。因此,客户端不需要使用AJAX这样的技术额外请求页面的数据。代码示例如下
优点:
1.前端耗时少。因为服务器端负责动态生成HTML内容,浏览器只需要直接渲染页面即可,尤其是移动端,更省电。
2.有利于SEO.因为服务器端响应是完整的HTML页面内容,所以爬虫更容易爬取获取信息,更有利于SEO
缺点:
1.占用服务器端资源。即服务器端完成HTML页面内容的拼接,如果请求较多,会对服务器造成一定的访问压力
2.不利于前后端分离,开发效率低。使用服务器端渲染,则无法进行分工合作,尤其对于前端复杂度高的项目,不利于项目高效开发。
2.基于前后端分离的新型Web开发模式
后端只负责提供Api接口,前端负责调用接口
如何选择Web开发模式
1.比如企业级网站,主要功能是展示而没有复杂的交互,并且需要良好的SEO,这时候我们就需要服务端渲染
2.类似于后台管理项目,交互性比较强,不需要考虑SEO,那么就可以使用前后端分离的开发模式。
Session 认证机制
http协议的无状态性
了解HTTP协议无状态性是进一步学习Session认证机制的必要前提。
HTTP协议的无状态性,指的是客户端的每次HTTP请求都是独立的,连续多个请求之间没有直接的关系,服务器
不会主动保留每次HTTP请求的状态。
注意:现实生活中的会员卡身份认证方式,在web开发中的专业术语叫做CooKie
不同域名下的Cookie各自独立,每当客户端发起请求时,会自动把当前域名下未过期Cookie一同发送到服务器。
Cookie的几大特性
1.自动发送
2.域名独立
3.过期时限
4.4kb限制
Cookie在身份认证中的作用
客户端第一次请求服务器的时候,服务器通过响应头的形式,向客户端发送一个身份认证的Cookie,客户端会自动将Cookie保存到浏览器中。 随后,当客户端浏览器每次请求服务器的时候,浏览器会自动将身份认证相关的Cookie,通过请求头的形式发送给服务器,服务器即可验明客户端的身份。
Cookie 不具有安全性
由于Cookie是存储在浏览器中的,而且浏览器也提供了读写Cookie的API,因此Cookie很容易被伪造,不具有安全性,因此不建议服务器将重要的隐私数据,通过Cookie的形式发送给浏览器。
Session的工作原理
JWT认证机制
了解Session 认证的局限性
Session认证机制需要配合Cookie才能实现,由于Cookie默认不支持跨域访问,所以,当涉及到前端跨域请求后端接口的时候,需要做很多额外的配置,才能实现跨域Session认证。
注意:
当前端请求后端接口不存在跨域问题的时候,推荐使用Session身份认证机制
当前端需要跨域请求后端接口的时候,不推荐使用Session身份认证机制,推荐使用JWT认证机制。
什么是JWT
JWT是目前最流行的跨域认证解决方案
JWT的工作原理
总结:用户的信息通过Token字符串的形式,保存在客户端浏览器中,服务器通过还原Token字符串的形式来认证用户的身份
JWT的组成部分
JWT通常由三部分组成,分别是header、Payload、Signature 三者之间使用英文的 '.'分隔,格式如下:
header.Payload.Signatrue
JWT的三个部分各自代表的含义
JWT的三个部分,从前到后分别是Header、Payload、Signatrue
其中
Payload部分才是真正的用户信息,它是用户信息经过加密之后生成的字符串
Header和signature是安全性相关的部分,只是为了保证Token的安全性
JWT的使用方式
客户端收到服务器返回的JWT之后,通常会将它存储在localStorage和SessionStorage中。
此后,客户端每次与服务器通信,都要带上这个JWT的字符串,从而进行身份认证,推荐的做法是把 JWT放在HTTP请求头的Authorization 字段中,格式如下
Authorization Bearer <token>
安装JWT相关的包
npm install jsonwebtoken express-jwt
其中jsonwebtoken用于生成JWT字符串
express-jwt用于将JWT字符串解析还原成JSON对象
使用require()函数,分别导入jwt相关的两个包
//用于生成JWT字符串的包
const jwt = require('jsonwebtoken')
//导入用于将客户端发送过来的JWT字符串,解析还原成JSON对象的包
const expressJWT = require('express-jwt')
定义secret密钥
为了保证JWT字符串的安全性,防止JWT字符串在网络传输过程中被别人破解,我们需要专门定义一个用于加密和解密的secret密钥
当生成JWT字符串的时候,需要使用secret密钥对用户的信息进行加密,最终得到加密JWT字符串
//secret 密钥的本质,就是一个字符串
const secretKey ='itheima NO1 dddd'
在登录成功后生成JWT字符串
调用jsonwebtoken 包提供的sign()方法,将用户的信息加密成JWT字符串,响应给客户端。