网络安全

HTTP 和 HTTPS 的区别

HTTP 是超文本传输协议，信息是明文传输的，端口是 80 响应速度比 HTTPS 快。

HTTPS 是 HTTP 的安全版本，信息是加密传输的，有 SSL 层，保证数据传输的真实性，端口是 443，需要 Ca 证书，费用比较贵。

HTTP请求的方式有哪些？

1. get 获取数据
2. post 创建数据
3. put 上传文件、更新数据
4. delete 删除服务端对象
5. head 获取报文首部
6. optins 询问支持的请求方法，用于跨域

get 和 post 的区别

get 主要从服务器端获取数据，参数放在 URL 里面，安全性比较差，可以缓存，刷新，收藏，get 传输数据有限，通常 2kb。

post 主要发送数据到服务器端，是通过 request body 进行传输的，post 数据进行了编码，安全性比较好，不可以缓存，收藏，刷新会被重新提交，传输数据大小不限。

重点的是

1. post 会产生两个 TCP 数据包，get 会产生一个 TCP 数据包
2. 对于 get 请求，浏览器会把 http,header,data 一并发出去，服务器响应 200 返回数据
3. 对于 post 请求，浏览器先发送 header,服务器响应 100 continue,浏览器再把 data 发出去，服务器响应 200 返回数据

性能优化的方法有哪些？

1. 减少 HTTP 请求
2. 减少 DNS 查询
3. 压缩资源文件
4. 添加本地缓存
5. 将 CSS 样式表放在顶部，把 javascript 放在底部（浏览器的运行机制决定）
6. 避免使用 CSS 表达式
7. 使用内容发布网络（CDN）
8. 使用外部 javascript 和 CSS
9. 避免重定向
10. 图片 lazyLoad

浏览器地址输入 URL 到页面发生了什么

1. 浏览器地址输入 URL 并回车
2. 浏览器地址栏检验 URL 是否被缓存,缓存是否过期
3. DNS 解析 URL 对应的 IP
4. 根据 IP 建立 TCP 连接(三次握手)
5. 发送 HTTP 请求
6. 服务器处理请求，浏览器接受 HTTP 响应
7. 浏览器解析并渲染页面
8. 关闭 TCP 连接(四次挥手)

三次握手

1. 第一次握手：客户端发送 SYN 报文和随机序号给服务器
2. 第二次握手: 服务端收到客户端请求后同意连接，发送 SYN ACK 和随机序号给客户端。
3. 第三次握手: 客户端收到后同意连接，发送 SYN ACK 给服务端。

常见的状态码

• 200 请求成功返回数据
• 204 请求成功，响应头没有 body 数据
• 301 永久重定向
• 302 临时重定向
• 304 (浏览器缓存命中)服务器响应成功，页面未修改，无内容返回
• 400 参数错误
• 401 身份未授权
• 403 服务器拒绝请求
• 404 找不到页面
• 500 服务器内部错误
• 504 服务器超时
• 401 和 403 的区别:一个是未登录了，一个是登录了没有权限

Cookie、sessionStorage、localStorage 的区别

相同点：

• 存储在客户端

不同点：

• cookie数据大小不能超过4k；sessionStorage和localStorage的存储比cookie大得多，可以达到5M+
• cookie设置的过期时间之前一直有效；localStorage永久存储，浏览器关闭后数据不丢失除非主动删除数据；sessionStorage数据在当前浏览器窗口关闭后自动删除
• cookie的数据会自动的传递到服务器；sessionStorage和localStorage数据保存在本地

HTTP 中的 keep-alive 有什么作用？http 多个请求是否能使用同一个 TCP 链接？

响应头中设置 keep-alive 可以在一个 TCP 连接上发送多个 HTTP 请求。

垃圾回收机制

标记清除: 进入执行环境的变量都会被标记，然后执行完，清除变量跟标记，查看变量是否被引用。

引用计数: 会记录每个值的引用次数，引用次数为 0 时，就会被释放。

git 常用命令有哪些？

1. git init 创建当前文件成 git 仓库
2. git clone 把网上仓库克隆下来
3. git add . 提交全部文件到暂存区
4. git commit -m 提交暂存区到仓库区，-m 是备注信息
5. git push 是上传文件
6. git pull 拉取代码
7. git branch 列出本地所有分支
8. git branch -r 列出远程 所有分支
9. git branch -d name 删除分支
10. git branch name 创建分支
11. git checkout name 跳转到分支
12. git checkout - 跳转到上一分支
13. git conifg --list 显示当前配置
14. git push origin name 创建远程分支
15. git push origin :name 删除远程分支
16. git reset --soft HEAD^ 这样就成功的撤销了你的commit 注意，仅仅是撤回commit操作，您写的代码仍然保留。

5. 总结

（1）2XX 成功

• 200 OK，表示从客户端发来的请求在服务器端被正确处理
• 204 No content，表示请求成功，但响应报文不含实体的主体部分
• 205 Reset Content，表示请求成功，但响应报文不含实体的主体部分，但是与 204 响应不同在于要求请求方重置内容
• 206 Partial Content，进行范围请求

（2）3XX 重定向

• 301 moved permanently，永久性重定向，表示资源已被分配了新的 URL
• 302 found，临时性重定向，表示资源临时被分配了新的 URL
• 303 see other，表示资源存在着另一个 URL，应使用 GET 方法获取资源
• 304 not modified，表示服务器允许访问资源，但因发生请求未满足条件的情况
• 307 temporary redirect，临时重定向，和302含义类似，但是期望客户端保持请求方法不变向新的地址发出请求

（3）4XX 客户端错误

• 400 bad request，请求报文存在语法错误
• 401 unauthorized，表示发送的请求需要有通过 HTTP 认证的认证信息
• 403 forbidden，表示对请求资源的访问被服务器拒绝
• 404 not found，表示在服务器上没有找到请求的资源

（4）5XX 服务器错误

• 500 internal sever error，表示服务器端在执行请求时发生了错误
• 501 Not Implemented，表示服务器不支持当前请求所需要的某个功能
• 503 service unavailable，表明服务器暂时处于超负载或正在停机维护，无法处理请求

2. TCP和UDP的区别

TCP: 面向连接的，传输可靠，一对一，面向字节流，用于传输大量的数据(流模式)，速度快，建立连接需要花销较多的时间和系统资源。应用场景:HTTP,邮件，文件传输

UDP: 面向非连接，传输不可靠，一对一，一对多，多对一，面向报文，用于传输少量的数据(数据包模式)，速度慢，可能会丢包。应用场景:视频会议，直播。

3. TCP和UDP的使用场景

• TCP应用场景： 效率要求相对低，但对准确性要求相对高的场景。因为传输中需要对数据确认、重发、排序等操作，相比之下效率没有UDP高。例如：文件传输（准确高要求高、但是速度可以相对慢）、接受邮件、远程登录。
• UDP应用场景： 效率要求相对高，对准确性要求相对低的场景。例如：QQ聊天、在线视频、网络语音电话（即时通讯，速度要求高，但是出现偶尔断续不是太大问题，并且此处完全不可以使用重发机制）、广播通信（广播、多播）。

七层模型

1. 应用层
2. 表示层
3. 会话层
4. 传输层
5. 网络层
6. 数据链路层
7. 物理层

浏览器的运行机制是什么？缓存是什么？

浏览器缓存

对浏览器的缓存机制的理解

浏览器缓存的全过程

• offer收割机之浏览器原理篇
• 前端浏览器缓存知识梳理

1. 浏览器第一次加载资源，服务器返回 200，浏览器从服务器下载资源文件，并缓存资源文件与 response header,以供下次加载时对比使用。
2. 下一次加载资源时，由于强制缓存优先级较高，先比较当前时间与上一次返回 200 时的时间差，如果没有超过 cache-control 设置的 max-age，则没有过期，并命中强缓存，直接从本地读取资源。如果浏览器不支持HTTP1.1，则使用 expires 头判断是否过期；
3. 如果资源已过期，则表明强制缓存没有被命中，则开始协商缓存，向服务器发送带有 If-None-Match 和 If-Modified-Since 的请求；
4. 服务器收到请求后，优先根据 Etag 的值判断被请求的文件有没有做修改，Etag 值一致则没有修改，命中协商缓存，返回 304；如果不一致则有改动，直接返回新的资源文件带上新的 Etag 值并返回 200；
5. 如果服务器收到的请求没有 Etag 值，则将 If-Modified-Since 和被请求文件的最后修改时间做比对，一致则命中协商缓存，返回 304；不一致则返回新的 last-modified 和文件并返回 200；

强缓存

强缓存是当我们访问 URL 的时候，不会向服务器发送请求，直接从缓存中读取资源，但是会返回 200 的状态码。

1. 浏览器会把资源缓存放在 memory cache 和 disk cache 中
2. 操作系统缓存文件放在 memory cache , 图片和网页文件放在 disk cache

协商缓存

协商缓存是等强缓存失效后，浏览器携带缓存标识向服务器发请求，由服务器根据缓存标识来决定是否使用缓存的过程。 有两种结果:

1. 协商缓存生效，返回 304
2. 协商缓存失效返回 200 和 请求结果。

缓存方案

1. 强缓存: JS CSS 图片
2. 协商缓存: HTML

协商缓存和强缓存的区别?

强缓存不会向服务器发请求，协商缓存会向服务器发请求。

1. 强缓存不发请求到服务器，所以有时候资源更新了浏览器还不知道，但是协商缓存会发请求到服务器，所以资源是否更新，服务器肯定知道。
2. 大部分web服务器都默认开启协商缓存。

刷新对于强缓存和协商缓存的影响

1. 当ctrl+f5强制刷新网页时，直接从服务器加载，跳过强缓存和协商缓存。
2. 当f5刷新网页时，跳过强缓存，但是会检查协商缓存。
3. 浏览器地址栏中写入URL，回车 浏览器发现缓存中有这个文件了，不用继续请求了，直接去缓存拿。（最快）

三种刷新的区别？

1. 刷新按钮+F5:浏览器直接对本地的缓存文件过期，会带上 if-modifed-Since ,服务器会对文件进行检查，返回结果可能是 304，也可能是200。
2. Ctrl + F5:浏览器对本地文件过期，不会带 if-modifed-Since ,返回结果 200。
3. 地址栏回车:浏览器发请求，本地检查是否过期，服务器检查文件，最后返回内容。

1. 对 WebSocket 的理解

WebSocket是HTML5提供的一种浏览器与服务器进行全双工通讯的网络技术，属于应用层协议。它基于TCP传输协议，并复用HTTP的握手通道。浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接， 并进行双向数据传输。

WebSocket 的出现就解决了半双工通信的弊端。它最大的特点是：服务器可以向客户端主动推动消息，客户端也可以主动向服务器推送消息。

WebSocket原理：客户端向 WebSocket 服务器通知（notify）一个带有所有接收者ID（recipients IDs）的事件（event），服务器接收后立即通知所有活跃的（active）客户端，只有ID在接收者ID序列中的客户端才会处理这个事件。

WebSocket 特点的如下：

• 支持双向通信，实时性更强
• 可以发送文本，也可以发送二进制数据‘’
• 建立在TCP协议之上，服务端的实现比较容易
• 数据格式比较轻量，性能开销小，通信高效
• 没有同源限制，客户端可以与任意服务器通信
• 协议标识符是ws（如果加密，则为wss），服务器网址就是 URL
• 与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。

WebSocket 特点的如下：

• 支持双向通信，实时性更强
• 可以发送文本，也可以发送二进制数据‘’
• 建立在TCP协议之上，服务端的实现比较容易
• 数据格式比较轻量，性能开销小，通信高效
• 没有同源限制，客户端可以与任意服务器通信
• 协议标识符是ws（如果加密，则为wss），服务器网址就是 URL
• 与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。

Websocket的使用方法如下：

在客户端中：

// 在index.html中直接写WebSocket，设置服务端的端口号为 9999
let ws = new WebSocket('ws://localhost:9999');
// 在客户端与服务端建立连接后触发
ws.onopen = function() {
    console.log("Connection open."); 
    ws.send('hello');
};
// 在服务端给客户端发来消息的时候触发
ws.onmessage = function(res) {
    console.log(res);       // 打印的是MessageEvent对象
    console.log(res.data);  // 打印的是收到的消息
};
// 在客户端与服务端建立关闭后触发
ws.onclose = function(evt) {
  console.log("Connection closed.");
};