Web 前端进阶—— Http 和数据结构学习笔记

最新推荐文章于 2024-10-17 21:40:42 发布

迎风的信号旗

最新推荐文章于 2024-10-17 21:40:42 发布

阅读量727

点赞数 29

分类专栏：前端 JavaScript 文章标签： http web 数据结构

本文链接：https://blog.csdn.net/cccloveforever/article/details/137734440

版权

本文深入探讨了Web前端进阶中的Http和数据结构知识点，包括http和https的区别、TCP与UDP的区别、fetch发送请求的机制、Cookie、sessionStorage和localStorage的区别、iframe的优缺点、Cookie防范XSS攻击的策略、HTTP状态码详解以及前端优化策略。此外，还介绍了数据结构的基础，如数组、队列、链表、栈、哈希及其在JavaScript中的实现。通过对这些概念的理解，开发者可以提升Web开发的专业技能。

摘要由CSDN通过智能技术生成

4、Cookie、sessionStorage、localStorage 的区别

11、输入 URL 到页面加载显示完成发生了什么?

12、CDN的优化原理

13、浏览器的内核分别是什么?

14、浏览器是如何渲染页面的？

15、GET请求方式的长度限制到底是多少？

16、什么是同源策略（Same origin policy）？

http/浏览器

1、说一下http和https

https 的 SSL 加密是在传输层实现的。

(1)http 和 https 的基本概念

http: 超文本传输协议，是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP），用于从 WWW 服务器传输超文本到本地浏览器的传输协议，它可以使浏览器更加高效，使网络传输减少。

https: 是以安全为目标的 HTTP 通道，简单讲是 HTTP 的安全版，即 HTTP 下加入 SSL 层，HTTPS 的安全基础是 SSL，因此加密的详细内容就需要 SSL。

https 协议的主要作用是：建立一个信息安全通道，来确保数组的传输，确保网站的真实性。

(2)http 和 https 的区别？

http 传输的数据都是未加密的，也就是明文的，网景公司设置了 SSL 协议来对 http 协议传输的数据进行加密处理，简单来说 https 协议是由 http 和 ssl 协议构建的可进行加密传输和身份认证的网络协议，比 http 协议的安全性更高。

主要的区别如下：

Https 协议需要 ca 证书，费用较高。
http 是超文本传输协议，信息是明文传输，https 则是具有安全性的 ssl 加密传输协议。使用不同的链接方式，端口也不同，一般而言，http 协议的端口为 80，https 的端口为 443
http 的连接很简单，是无状态的；HTTPS 协议是由 SSL+HTTP 协议构建的可进行加密传输、身份认证的网络协议，比 http 协议安全。

(3)https 协议的工作原理

客户端在使用 HTTPS 方式与 Web 服务器通信时有以下几个步骤。

客户使用 https url 访问服务器，则要求 web 服务器建立 ssl 链接。

web 服务器接收到客户端的请求之后，会将网站的证书（证书中包含了公钥），返回或者说传输给客户端。

客户端和 web 服务器端开始协商 SSL 链接的安全等级，也就是加密等级。

客户端浏览器通过双方协商一致的安全等级，建立会话密钥，然后通过网站的公钥来加密会话密钥，并传送给网站。

web 服务器通过自己的私钥解密出会话密钥。

web 服务器通过会话密钥加密与客户端之间的通信。

(4)https 协议的优点

使用 HTTPS 协议可认证用户和服务器，确保数据发送到正确的客户机和服务器；

HTTPS 协议是由 SSL+HTTP 协议构建的可进行加密传输、身份认证的网络协议，要比 http 协议安全，可防止数据在传输过程中不被窃取、改变，确保数据的完整性。

HTTPS 是现行架构下最安全的解决方案，虽然不是绝对安全，但它大幅增加了中间人攻击的成本。

谷歌曾在 2014 年 8 月份调整搜索引擎算法，并称“比起同等 HTTP 网站，采用 HTTPS 加密的网站在搜索结果中的排名将会更高”。

(5)https 协议的缺点

https 握手阶段比较费时，会使页面加载时间延长 50%，增加 10%~20%的耗电。

https 缓存不如 http 高效，会增加数据开销。

SSL 证书也需要钱，功能越强大的证书费用越高。

SSL 证书需要绑定 IP，不能再同一个 ip 上绑定多个域名，ipv4 资源支持不了这种消耗。

2、TCP 和 UDP 的区别

（1）TCP 是面向连接的，udp 是无连接的即发送数据前不需要先建立链接。

（2）TCP 提供可靠的服务。也就是说，通过 TCP 连接传送的数据，无差错，不丢失，不重复，且按序到达;UDP 尽最大努力交付，即不保证可靠交付。并且因为 tcp 可靠，面向连接，不会丢失数据因此适合大数据量的交换。

（3）TCP 是面向字节流，UDP 面向报文，并且网络出现拥塞不会使得发送速率降低（因此会出现丢包，对实时的应用比如 IP 电话和视频会议等）。

（4）TCP 只能是 1 对 1 的，UDP 支持 1 对 1,1 对多。

（5）TCP 的首部较大为 20 字节，而 UDP 只有 8 字节。

（6）TCP 是面向连接的可靠性传输，而 UDP 是不可靠的。

3、fetch 发送 2 次请求的原因

fetch 发送 post 请求的时候，总是发送 2 次，第一次状态码是 204，第二次才成功？原因很简单，因为你用 fetch 的 post 请求的时候，导致 fetch 第一次发送了一个 Options 请求，询问服务器是否支持修改的请求头，如果服务器支持，则在第二次中发送真正的请求。

4、Cookie、sessionStorage、localStorage 的区别

共同点：都是保存在浏览器端，并且是同源的

Cookie：cookie 数据始终在同源的 http 请求中携带（即使不需要），即 cookie 在浏览器和服务器间来回传递。而 sessionStorage 和 localStorage 不会自动把数据发给服务器，仅在本地保存。cookie 数据还有路径（path）的概念，可以限制 cookie 只属于某个路径下, 存储的大小很小只有 4K 左右。（key：可以在浏览器和服务器端来回传递，存储容量小，只有大约 4K 左右） sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持，localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie 只在设置的 cookie 过期时间之前一直有效，即使窗口或浏览器关闭。（key：本身就是一个回话过程，关闭浏览器后消失，session 为一个回话，当页面不同即使是同一页面打开两次，也被视为同一次回话） localStorage：localStorage 在所有同源窗口中都是共享的；cookie 也是在所有同源窗口中都是共享的。（key：同源窗口都会共享，并且不会失效，不管窗口或者浏览器关闭与否都会始终生效）

补充说明一下 cookie 的作用：保存用户登录状态。例如将用户 id 存储于一个 cookie 内，这样当用户下次访问该页面时就不需要重新登录了，现在很多论坛和社区都提供这样的功能。 cookie 还可以设置过期时间，当超过时间期限后，cookie 就会自动消失。因此，系统往往可以提示用户保持登录状态的时间：常见选项有一个月、三个月、一年等。