1. token
- 什么是token
- token是验证身份的令牌,一般是用户通过账号密码登录后,服务端把这些凭证通过加密等一系列操作后得到的字符串
- token都存在哪里,有什么区别
- 存localstorage里,后期每次请求接口时都需要把它当做字段传给后台,容易被XSS攻击,但可以做相应措施,利大于弊
- 存sessionstorage里
- 存cookie里,会自动发送,但不能跨域,会有CSRF攻击
- token的登录流程
-
- 客户端通过账号密码请求登录
-
- 服务端收到请求后去验证账号密码
-
- 验证成功后,服务端签发一个token,并发送给客户端
-
- 客户端收到token后保存在cookie或localstorage里
-
- 客户端每次向服务端发送请求资源的时候,都需要携带这个token
-
- 服务端收到请求,然后去验证接收到的token,验证成功后才会返回客户端请求的数据
- JWT
2. 浏览器页面渲染的过程
- DNS解析
- 建立TCP连接
- 发送HTTP请求
- 渲染页面
-
- 浏览器获取HTML和CSS资源
-
- 把HTML解析成DOM树(一一对应,包括head和隐藏元素),把CSS解析成CSSOM
-
- 把DOM和CSSOM合并为渲染树(不包括head和隐藏元素)
-
- 布局绘制
- 断开TCP连接
3. SVG格式
- 什么是SVG格式
- 基于XML语法的图像格式,可缩放矢量图,本质是文本文件,体积小,无论放大多少倍都不会失贞
- SVG作用
- 可以通过
<svg></svg>
直接插入到页面中,称为DOM一部分,然后用css或js操作 - 可作为文件被引用
<img scr='pic.svg'/>
- 可转为base64引入页面
4. 精灵图和base64
- sprite(精灵图):把多个小图标合成一张大图片
- 精灵图优缺点
- 优点:减少了http请求的次数,提升了性能
- 缺点:维护比较差,牵一发而动全身
- base46
- 传输8bit字节代码的编码方式,把原本二进制的形式转换为64个字附的单位,最后组成字符串
- 优点: base64和HTML css一起下载到浏览器中,减少请求和跨域问题
- 缺点: 低版本不支持;如果base64体积比原图大,不利于css的加载