浏览器
文章平均质量分 58
宇六岁鸭
小憨包一枚
展开
-
【前端学习 - 浏览器(12)跨域】
1. 跨域什么是同源策略:同源策略是指协议、端⼝、域名相同,也就是在同⼀个域中。⾮同源受到的限制:cookie⽆法读取、dom⽆法获取、ajax请求⽆法发送。什么是跨域:两个不同域(协议、端⼝、域名不同)之间进⾏请求。解决跨域的⽅法:JSONP,通过动态创建⼀个script标签,script标签的src属性是没有跨域的限制的。 cors,服务端在response时增加⼀些头信息: Access-Control-Allow-Origin: http://ip:p原创 2022-01-21 15:00:00 · 205 阅读 · 0 评论 -
【前端学习 - 浏览器(11)http/https 协议】
1. http/https 协议1-1. [1.] 协议缺陷:无法复用链接,完成即断开,重新慢启动和 TCP 3次握手 head of line blocking: 线头阻塞,导致请求之间互相影响1-2. [1.1] 改进:长连接(默认 keep-alive),复用 host 字段指定对应的虚拟站点新增功能:断点续传 身份认证 状态管理 cache 缓存 Cache-Control Expires Last-Modified Etag1-3. [2.0]:多路复用原创 2022-01-21 14:30:00 · 271 阅读 · 0 评论 -
【前端学习 - 浏览器(10)存储】
1.存储我们经常需要对业务中的一些数据进行存储,通常可以分为 短暂性存储 和 持久性储存。短暂性的时候,我们只需要将数据存在内存中,只在运行时可用 持久性存储,可以分为 浏览器端 与 服务器端浏览器:cookie: 通常用于存储用户身份,登录状态等 http 中自动携带, 体积上限为 4K, 可自行设置过期时间 localStorage / sessionStorage: 长久储存/窗口关闭删除, 体积限制为 4~5M indexDB服务器:分布式缓存 redis 数据库..原创 2022-01-21 11:30:00 · 167 阅读 · 0 评论 -
【前端学习 - 浏览器(9)重绘与回流】
1.重绘与回流当元素的样式发生变化时,浏览器需要触发更新,重新绘制元素。这个过程中,有两种类型的操作,即重绘与回流。重绘(repaint):当元素样式的改变不影响布局时,浏览器将使用重绘对元素进行更新,此时由于只需要UI层面的重新像素绘制,因此 损耗较少回流(reflow):当元素的尺寸、结构或触发某些属性时,浏览器会重新渲染页面,称为回流。此时,浏览器需要重新经过计算,计算后还需要重新页面布局,因此是较重的操作。会触发回流的操作:页面初次渲染 浏览器窗口大小改变 元素尺原创 2022-01-21 10:30:00 · 223 阅读 · 0 评论 -
【前端学习 - 浏览器(8)浏览器下事件循环(Event Loop)】
1.浏览器下事件循环(Event Loop)首先,整体的script(作为第一个宏任务)开始执行的时候,会把所有代码分为同步任务、异步任务两部分 同步任务会直接进入主线程依次执行 异步任务会再分为宏任务和微任务 宏任务进入到Event Table中,并在里面注册回调函数,每当指定的事件完成时,Event Table会将这个函数移到Event Queue(事件队列)中 微任务也会进入到另一个Event Table中,并在里面注册回调函数,每当指定的事件完成时,Event Table会将这个函数原创 2022-01-21 09:00:00 · 210 阅读 · 0 评论 -
【前端学习 - 浏览器(7)TCP-断开连接】
1、断开连接当数据传送完毕,需要断开 tcp 连接,此时发起 tcp 四次挥手。发起方向被动方发送报文,Fin、Ack、Seq,表示已经没有数据传输了。并进入 FIN_WAIT_1 状态。(第一次挥手:由浏览器发起的,发送给服务器,我请求报文发送完了,你准备关闭吧) 被动方发送报文,Ack、Seq,表示同意关闭请求。此时主机发起方进入 FIN_WAIT_2 状态。(第二次挥手:由服务器发起的,告诉浏览器,我请求报文接受完了,我准备关闭了,你也准备吧) 被动方向发起方发送报文段,Fin、Ack原创 2022-01-20 08:00:00 · 502 阅读 · 0 评论 -
【前端学习 - 浏览器(6)浏览器解析渲染页面】
1、浏览器解析渲染页面**浏览器拿到响应文本 HTML 后,接下来介绍下浏览器渲染机制浏览器解析渲染页面分为一下五个步骤:根据 HTML 解析出 DOM 树 根据 CSS 解析生成 CSS 规则树 结合 DOM 树和 CSS 规则树,生成渲染树 根据渲染树计算每一个节点的信息 根据计算好的信息绘制页面1-1.根据 HTML 解析 DOM 树根据 HTML 的内容,将标签按照结构解析成为 DOM 树,DOM 树解析的过程是一个深度优先遍历。即先构建当前节点的所有子节点,再构建下一个兄原创 2022-01-20 00:00:00 · 159 阅读 · 0 评论 -
【前端学习 - 浏览器(5)服务器处理请求并返回 HTTP 报文】
1、服务器处理请求并返回 HTTP 报文1-1. 服务器服务器是网络环境中的高性能计算机,它侦听网络上的其他计算机(客户机)提交的服务请求,并提供相应的服务,比如网页服务、文件下载服务、邮件服务、视频服务。而客户端主要的功能是浏览网页、看视频、听音乐等等,两者截然不同。 每台服务器上都会安装处理请求的应用——web server。常见的 web server 产品有 apache、nginx、IIS 或 Lighttpd 等。web server 担任管控的角色,对于不同用户发送的请求,会结合配原创 2022-01-19 08:00:00 · 1526 阅读 · 0 评论 -
【前端学习 - 浏览器(4)发送 HTTP 请求】
1、发送 HTTP 请求TCP 三次握手结束后,开始发送 HTTP 请求报文。 请求报文由请求行(request line)、请求头(header)、请求体3个部分组成,如:1-1. 请求行-----包含请求方法、URL、协议版本请求方法包含 8 种: GET、POST、PUT、DELETE、PATCH、HEAD、OPTIONS、TRACE。 URL 即请求地址,由 <协议>://<主机>:<端口>/<路径>?<参数> 组成 协议版原创 2022-01-19 00:15:00 · 1410 阅读 · 0 评论 -
【前端学习 - 浏览器(3)TCP 三次握手】
1、TCP 三次握手接下来介绍向服务器发送 HTTP 请求阶段,HTTP 请求分为三个部分:TCP 三次握手、http 请求响应信息、关闭 TCP 连接。在客户端发送数据之前,会发起 TCP 三次握手用以同步客户端和服务端的序列号和确认号,并交换 TCP 窗口大小信息。1-1.TCP 三次握手的过程如下:客户端发送一个带 SYN=1,Seq=X 的数据包到服务器端口(第一次握手,由浏览器发起,告诉服务器我要发送请求了) 服务器发回一个带 SYN=1, ACK=X+1, Seq=Y 的响应包原创 2022-01-19 00:00:00 · 487 阅读 · 0 评论 -
【前端学习 - 浏览器 (2)域名解析】
1、域名解析(DNS)在浏览器输入网址后,首先要经过域名解析,因为浏览器并不能直接通过域名找到对应的服务器,而是要通过 IP 地址。大家这里或许会有个疑问----计算机既可以被赋予 IP 地址,也可以被赋予主机名和域名。比如 www.hackr.jp。那怎么不一开始就赋予个 IP 地址?这样就可以省去解析麻烦。我们先来了解下什么是 IP 地址1-1. IP 地址IP 地址是指 互联网协议地址 。它为互联网上的每一个网络和每一台主机分配一个逻辑地址,以此来屏蔽物理地址的差异。IP 地址是一个 32原创 2022-01-09 23:26:59 · 856 阅读 · 0 评论 -
【前端学习 - 浏览器 (1)URL】
1.从URL输入到页面展现发生了什么DNS 解析: 将域名解析成 IP 地址 TCP 连接:TCP 三次握手 发送 HTTP 请求 服务器处理请求并返回 HTTP 报文 浏览器解析渲染页面,构建dom树,样式树,渲染树,layout布局,painting绘制 断开连接:TCP 四次挥手详解:URL 是什么URL(Uniform Resource Locator),统一资源定位符,俗称网址。用于定位互联网上资源。URL 给资源的位置提供了一种抽象的识别方法,并用这种方法给资源定位,原创 2022-01-09 23:22:58 · 1158 阅读 · 0 评论