HTTP协议的特点
HTTP协议的发展
HTTP/2
HTTP/2比HTTP/1更快更稳定更简单的原因:从整个文本传输到分割成一个个帧并用二进制编码的的形式进行传输,同时加入了一些压缩算法使传输效率更高一些。
消息和数据流
响应消息:就包含响应头、响应体
建立连接,连接里有很多个双向字节流。
传输的最小单位是帧,而帧是可以交错发送的。因为帧里边会有一些标记信息,而接收方会将这些帧里边的标记信息组织起来就可以得到完整的消息。
HTTP2特性
HTTPS
HTTP常见请求
安全的请求方法
状态码
RESTful API
常用请求头
常用响应头
缓存
协商缓存:浏览器与服务器之间进行通信以确认缓存资源是否仍然有效的过程。
浏览器缓存流程
cookie
场景分析
cache:缓存
登录场景分析:
怎么确保登录后用户刷新界面还是登录状态?
怎么确保用户尽可能快地拿到的静态资源?
怎么确保用户拿到的静态资源足够新?
静态资源
静态资源请求举例:
应用场景:用CDN可以使用户尽可能快地拿到的静态资源;而怎么确保用户拿到的静态资源够新?
更新了.css文件,但浏览器的强缓存有效期为1年,怎么确保用户刷新页面后页面会用新的.css文件?
方法:对.css文件名做更改,加上一些hash值
跨域
跨域,指的是从一个域名去请求另外一个域名的资源,即跨域名请求。跨域时,浏览器不能执行其他域名网站的脚本,这是由浏览器的同源策略造成的,是浏览器施加的安全限制, 跨域限制访问,其实是浏览器的限制。
同源策略是浏览器最核心也最基本的安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源 ,这是一个用于隔离潜在恶意文件的重要安全机制。所以跨域问题只在浏览器中出现,如果客户端是APP的话,那跨域问题就不存在了。 PS:IE端口除外,IE对同源策略的定义有略微的不同。
同源是指:协议、域名,端口,【scheme(协议)、host name(主机名/域名)、port(端口号)】相同,即两个资源具有相同的源。 只要三者之间有一个不同,就是cross-origin跨域(跨源)。
非同源限制
只针对AJAX请求跨域
- 无法读取非同源网页的
Cookie、LocalStorage和IndexedDB - 无法对非同源网页的
DOM和JS对象进行操作 - 无法向非同源地址发送
AJAX请求
跨域解决方案:
CORS
http默认端口号为80;https默认端口号为443
预请求:method: OPTIONS 大部分跨域场景会发起预请求,因为只有复杂请求才会发起跨域请求。请求可以大致分为简单请求和复杂请求。
代理服务器
将代理服务器和当前地址部署到同一个域下,就没有跨域问题了
iframe
较不常见
鉴权
怎么确保登录后用户刷新界面还是登录状态
Session+cookie
过程:
登录成功后会发起一个提交的请求,把当前信息提交给Serve服务器,服务器收到后会验证信息的正确性,如果正确,服务器会生成一个session并存储起来,并在此次请求的响应中,服务器会借由set-cookie生成一个seesion 的cookie,放到相同域的下面。下一次浏览器再访问,会自动携带该session的cookie,服务器根据该cookie就跨域正确识别信息了。
JWT
过程:
统一提交请求后,服务器会生成一个token(token有一些约定的格式),服务器不会存储token,而是放到响应里返回给浏览器;浏览器下一次请求的话会带着token,提交给服务器,服务器会对token解析验证并返回给浏览器。
JWT优点:token的唯一性。
SSO
Ajax
Fetch
Fetch特点:
XMLHttpRequet的升级版使用Promise模块化设计,Response,Request, Header对通过数据流处理对象,支持分块读取
axios
常用的请求库:axios·支持浏览器、nodejs环境·丰富的拦截器
网络优化
网络稳定性
扩展
WebSocket:
QUIC: