web网络

832 阅读9分钟

协商缓存和强缓存

HTTP Cache

基于http缓存,有以下解决方案

  • expires(强缓存)
  • cache-control(强缓存)
  • last-modified(协商缓存)
  • etag(协商缓存)

expires(强缓存)

  • 设置对象的有效期,如果在设置的这个时间之前请求,那么将去读本地缓存,设置在请求头
  • 缺点:当服务器上的时间和客户端时间不一致时,会出问题
  • 由此引出 cache-control

cache-control

  • 以下是五种常用形式,设置在请求头
  • max-age=num(s),设置最大缓存时间
  • public,缓存能被多用户共享(如代理服务器)
  • private,缓存不能在用户间共享,只能浏览器
  • no-cache,缓存,浏览器使用缓存前,都会请求服务器缓存资源是否是最新的(协商缓存验证)。
  • no-store,不能被存储
  • 缺点HTTP 1.1 才有的内容,不适用于HTTP 1.0

last-modified

  • 设置对象最后修改时间,第一次请求的时候,设置last-modified响应头,然后在第二次请求的时候,浏览器会带上这个时间,由If-Modified-Since携带,然后服务端会进行比较,如果一致就返回304。
  • 缺点: last-modified是精确到秒的,如果1s内修改文件两次,那么last-modified区分不出来

Etag

  • 根据内容判断,保存的可以是文件的hash或者md5

注意点

  • 协商缓存每次都需要访问服务器,但是它返回的资源大小是不一样的
  • 强缓存和对比缓存同时存在,如果强缓存还在生效期则强制缓存覆盖对比缓存,对比缓存不生效;如果强缓存不在有效期,对比缓存生效。即:强缓存优先级 > 对比缓存优先级
  • 强缓存expires和cache-control同时存在时,则cache-control会覆盖expires,expires无论有没有过期,都无效。 即:cache-control优先级 > expires优先级。
  • 对比缓存Etag和Last-Modified同时存在时,则Etag会覆盖Last-Modified,Last-Modified不会生效。即:ETag优先级 > Last-Modified优先级。
  • 总结:Cache-Control>Expires>Etag>Last-Modified

三次握手

注意点以及几个名词

  • 三次握手的最主要目的是为了检验客户端和服务端接收和发送能力是否正常
  • seq => 随机号,序列号
  • ack 注意小写 => 确认号 (seq+1 =ack)
  • ACK 注意大写 => 当ACK为1时,表示确认序号有效
  • SYN => 发起一个新连接,当SYN为1时,发起一个新连接

过程

  • 开始客户端主动开启,结束 Closed 的状态,服务端被动开启,结束 Closed 的状态,进入Listen 状态
  • 客户端给服务端发一个报文,包含SYN=1(建立一个新连接),seq=x(一个随机序列号)客户端处于 SYN_SEND 状态。
  • 当服务端收到后,发送SYN = 1(建立一个新连接),ACK= 1(确认收到序列号),seq = y(自己的序列号), ack = x+1(确认收到客户端的序列号),进入 SYN_RCVD
  • 客户端发送ACK = 1(确认收到序列号),seq =x + 1(第一次是x,这次加一), ack=y+1(服务端发过来的是y,ack=y+1)双方进入 ESTABLISHED 状态,此时,双方已建立起了连接。

image.png

www.zhihu.com/question/35… 复习用cookie和session和token的使用

当我们访问一个网址的时候,发生了什么?

这个流程可以分为两部分来说,第一部分是浏览器请求响应的过程;

  • 输入URL:用户在地址栏按下回车,先检查输入的是搜索关键字还是符合url的规则,然后将其组装成完整 URL进行访问;
  • 检查缓存:然后会先检查本地强缓存是否可用,如果可用就直接从缓存中返回资源;
  • DNS解析:如果强缓存不可用,就会进行DNS解析,通过递归查询迭代查询解析域名来得到域名对应的IP地址
    • DNS查询的顺序为:浏览器IP缓存,操作系统IP缓存,Hosts文件,DNS根服务器;
  • 建立TCP连接:得到IP地址后,会进行三次握手去建立TCP连接;
  • 发送HTTP请求:建立TCP连接后发送 HTTP 请求,发送HTTP请求时会携带上cookie缓存的标识字段;
  • 负载均衡:服务端网关收到HTTP请求后,可能会有一系列的负载均衡处理,通过反向代理分配给对应集群中的服务器去执行;
  • 服务器返回响应:服务器收到请求后,先根据请求头的缓存标识来判断缓存是否生效,生效就返回304状态码;不生效就返回资源和200状态码(在返回200的响应报文前,还可能会返回103的响应报文);
  • 浏览器接收HTTP响应:浏览器接受到HTTP响应后根据 connection:keep-alive 的值来选择通过 四次挥手来断开TCP连接,或者保留;
  • 同时浏览器还会缓存响应头里的缓存标识字段

到此为止,浏览器请求响应的过程就结束了;第二部分就是浏览器解析并渲染的过程;

  • 构建DOM树:浏览器从上到下解析 HTML 文档生成DOM节点树;
  • 构建CSSOM树:浏览器解析遇到样式时,会进行异步下载,下载完成后构建 CSSOM树;
  • 值得一提的是,当遇到不带 asyncdeferscript 时,会阻止解析HTML并进行下载和执行;
    • 并且CSSDOM渲染,JSDOM解析之间是有阻塞关系的;
  • 构建渲染树:根据DOM节点树和CSSOM树构建渲染树(Render);
  • 布局(Layout):根据渲染树将DOM节点树每一个节点布局在屏幕上的正确位置;
  • 绘制(Paint):绘制所有节点,为每一个节点适用对应的样式,绘制到屏幕上;
    • 绘制的过程中还有很多细节,包括说:
    • 构建图层树:需要对布局树进行分层,生成图层树(比如说Z轴排序)
    • 生成绘制列表:将图层的绘制拆分为很多的绘制指令,并按顺序组成绘制列表,并提交到合成线程中;
    • 光栅化(栅格化)生成位图:合成线程图层划分成图块,并在光栅化线程池中将图块转换成位图
      • 同时因为用户只能看到视口的这一部分,所以合成线程就会按照视口附近的图块来优先生成位图
    • 显示:一旦所有的图块都被光栅化,合成线程就会提交绘图指令给浏览器进程;浏览器进程生成页面并显示到屏幕上;

https和http的主要区别

  • http是超文本传输协议,信息是明文传输,https则是具有安全性的ssl加密传输协议,http和https协议主要区别在于https数据请求有加密,ssl加密

  • http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。

cookie和session

  • session保存在服务器,客户端不知道其中的信息;cookie保存在客户端,服务器能够知道其中的信息。

  • session中保存的是对象,cookie中保存的是字符串。

  • HTTP协议是无状态的协议。一旦数据交换完毕,客户端与服务器端的连接就会关闭,再次交换数据需要建立新的连接。这就意味着服务器无法从连接上跟踪会话。即用户A购买了一件商品放入购物车内,当再次购买商品时服务器已经无法判断该购买行为是属于用户A的会话还是用户B的会话了。要跟踪该会话,必须引入一种机制。

  • Session是另一种记录客户状态的机制,不同的是Cookie保存在客户端浏览器中,而Session保存在服务器上。客户端浏览器访问服务器的时候,服务器把客户端信息以某种形式记录在服务器上。这就是Session。客户端浏览器再次访问时只需要从该Session中查找该客户的状态就可以了。

  • 1.cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKIE欺骗考虑到安全应当使用session。2、设置cookie时间可以使cookie过期。但是使用session-destory(),我们将会销毁会话。3、session会在一定时间内保存在服务器上。当访问增多,会比较占用你服务器的性能考虑到减轻服务器性能方面,应当使用cookie。4、单个cookie保存的数据不能超过4K,很多浏览器都限制一个站点最多保存20个cookie。(Session对象没有对存储的数据量的限制,其中可以保存更为复杂的数据类型)

浏览器安全策略

1.同源策略:不同域的客户端脚本在没授权的情况下,不能读写对方的资源

2.沙盒框架(frame

3.Flash安全沙箱

4.cookie

  • 设置cookie的samesite值
  • Strict最为严格,完全禁止第三方 Cookie,跨站点时,任何情况下都不会发送 Cookie。换言之,只有当前网页的 URL 与请求目标一致,才会带上 Cookie;

Set-Cookie: CookieName=CookieValue; SameSite=Strict; 这个规则过于严格,可能造成非常不好的用户体验。比如,当前网页有一个 GitHub 链接,用户点击跳转就不会带有 GitHub 的 Cookie,跳转过去总是未登陆状态。

  • Lax规则稍稍放宽,大多数情况也是不发送第三方 Cookie,但是导航到目标网址的 Get 请求除外。

Set-Cookie: CookieName=CookieValue; SameSite=Lax;

  • None 不设置 Chrome 80.0中将SameSite的默认值设为Lax

5.内容安全策略(在响应头设置参数,来允许哪些域来源的文件执行