18. http网络请求基本知识

[JayFate]

18. http网络请求基本知识

[JayFate]

网络基础知识

HTTP

一般我们都会说 “HTTP 是一个无状态的协议”，不过要注意这里的 HTTP 其实是指 HTTP 1.x，而所谓无状态协议，简单的理解就是即使同一个客户端连续两次发送请求给服务器，服务器也识别不出这是同一个客户端发送的请求，这导致的问题就比如你加了一个商品到购物车中，但因为识别不出是同一个客户端，你刷新下页面就没有了……

HTTPS 基础知识

谈谈 HTTPS

Cookie

为了解决 HTTP 无状态导致的问题，后来出现了 Cookie。不过这样说可能会让你产生一些误解，首先无状态并不是不好，有优点，但也会导致一些问题。而 Cookie 的存在也不是为了解决通讯协议无状态的问题，只是为了解决客户端与服务端会话状态的问题，这个状态是指后端服务的状态而非通讯协议的状态。

Cookie 介绍

那我们来看下 Cookie，引用下维基百科：

Cookie（复数形态Cookies），类型为「小型文本文件」，指某些网站为了辨别用户身份而储存在用户本地终端上的数据。

作为一段一般不超过 4KB 的小型文本数据，它由一个名称（Name）、一个值（Value）和其它几个用于控制 Cookie 有效期、安全性、使用范围的可选属性组成，这些涉及的属性我们会在后面会介绍。

Cookie 的查看

我们可以在浏览器的开发者工具中查看到当前页面的 Cookie：

尽管我们在浏览器里查看到了 Cookie，这并不意味着 Cookie 文件只是存放在浏览器里的。实际上，Cookies 相关的内容还可以存在本地文件里，就比如说 Mac 下的 Chrome，存放目录就是 ~/Library/Application Support/Google/Chrome/Default，里面会有一个名为 Cookies 的数据库文件，你可以使用 sqlite 软件打开它：

存放在本地的好处就在于即使你关闭了浏览器，Cookie 依然可以生效。

Cookie 的设置

那 Cookie 是怎么设置的呢？简单来说就是

1. 客户端发送 HTTP 请求到服务器
2. 当服务器收到 HTTP 请求时，在响应头里面添加一个 Set-Cookie 字段
3. 浏览器收到响应后保存下 Cookie
4. 之后对该服务器每一次请求中都通过 Cookie 字段将 Cookie 信息发送给服务器。

我们以 https://main.m.taobao.com/ 为例来看下这个过程：

我们在请求返回的 Response Headers 可以看到 Set-Cookie 字段：

然后我们查看下 Cookie：

我们刷新一遍页面，再看下这个请求，可以在 Request Headers 看到 cookie 字段：

Cookies 的属性

在下面这张图里我们可以看到 Cookies 相关的一些属性：

web安全

寒冬求职之你必须要懂的Web安全

浏览器缓存

深入理解浏览器的缓存机制

参考链接

1. https://juejin.cn/post/6844904095711494151

[JayFate]

网络请求的基本过程

• 用户输入 url 地址，浏览器查询 DNS 查找对应的请求 IP 地址
• 建立 TCP 连接
• 浏览器向服务器发送 http 请求，如果服务器段返回以 301 之类的重定向，浏览器根据相应头中的 location 再次发送请求
• 服务器端接受请求，处理请求生成 html 代码，返回给浏览器，这时的 html 页面代码可能是经过压缩的
• 浏览器接收服务器响应结果，如果有压缩则首先进行解压处理，紧接着就是页面解析渲染
• 解析该过程分为：解析 HTML，构建 DOM 树，DOM 树与 CSS 样式进行附着构造呈现树，布局、绘制