前端面试题之【HTTP/HTML/浏览器】

1.说一下http与https

http：超文本传输协议，https：超文本传输安全协议
区别：

1. http传输数据是未加密的，是明文传输；https使用ssl协议对数据进行加密处理；
2. https协议需要ca证书，费用高；
3. http端口号为80，https端口号为443；
4. http是无状态连接，两者都是采用tcp的三次握手进行连接。

2. Https如何进行加密传输

3.http1.0与http2.0的区别，2.0与3.0呢

4.TCP三次握手

1. c向s发包等待s确认；
2. s收到包后确认再向c发包等待确认；
3. c收到包后确认再向s发包，然后双方处于可发送或接收状态。

5.TCP与UDP

1. tcp面向连接，udp不需要先建立连接；
2. TCP面向字节流，UDP面向报文；
3. TCP可靠。

6.Websocket

1. Websocket是H5中的协议，支持持久连接；
2. 基于http协议，可以发送多个request接收多个response；
3. WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就可以创建持久性的连接，并进行双向数据传输。

7.输入一段url后

1. DNS解析域名，拿到真实IP；
2. 建立连接，TCP三次握手；
3. 拿数据，渲染页面；
4. 四次挥手。

8.如何渲染页面？

1. html形成DOM树，css形成css结构体；
2. 它们两者形成render tree渲染树；
3. 计算页面布局；
4. UI引擎渲染出页面。

9.HTTP请求

10. 状态码

1. 200 请求成功
2. 400 客户端请求的语法错误，服务器无法理解
3. 401 请求要求用户的身份认证
4. 403 服务器理解请求客户端的请求，但是拒绝执行此请求
5. 404 服务器无法根据客户端的请求找到资源（网页）
6. 500 服务器内部错误，无法完成请求

11.fetch发送两次请求

之所以会发送2次请求，那是因为我们使用了带预检的跨域请求（除了get、post、head请求）。该请求会在发送真实的请求之前发送一个类型为OPTIONS的预检请求。预检请求会检测服务器是否支持我们的真实请求所需要的跨域资源，唯有资源满足条件才会发送真实的请求。比如我们在请求头部增加了authorization项，那么在服务器响应头中需要放入Access-Control-Allow-Headers，并且其值中必须要包含authorization，否则OPTIONS预检会失败，从而导致不会发送真实的请求。

12.cookie、sessionstorage与localstorage的区别

1. cookie在浏览器和服务器之间来回传递，sessionStorage、localStorage：仅在客户端（浏览器）中保存，不参与服务器的通信；
2. cookie存储大小更小，否则会造成性能问题；
3. cookie：判断用户是否登录过网站，以便实现下次自动登录或记住密码；保存事件信息；sessionStorage：敏感账号一次性登录，单页面用的较多；localStorage：用于长期登录，适于长期保存在本地的数据；
4. cookie有效期一般服务器设置；localstorage一般永久，除非自己手动删除reomveItem，或者清除浏览记录；sessionstorage一般在页面关闭就失效。

13.webworker

14. 请求头内容

15. Cookie

16.XSS攻击与CRSF攻击

17.TCP拥塞控制

18. 跨域问题

19.session与cookie

20.HTML语义化标签

21.viewport与移动端布局

22. 事件流 addEventListener

23.强缓存与协商缓存

24.GET与POST区别

25.网站性能

26.H5新特性

27.meta 与Doctype