前端复习记录（前端基础 游览器）二

HTTP/HTML/浏览器(二)

http常用请求头

协议头	说明
Accept	可接受的响应内容类型
Accept-Charset	可接受的字符集
Accept-Encoding	可接受的响应内容的编码方式
Accept-Language	可接受的响应内容语言列表
Accept-Datetime	可接受的按照时间来表示的响应内容版本
Authorization	用于表示HTTP协议中需要认证资源的认证信息
Cache-Control	用来指定当前的请求/回复中的，是否使用缓存机制。
Connection	客户端（浏览器）想要优先使用的连接类型
Cookie	由之前服务器通过Set-Cookie（见下文）设置的一个HTTP协议Cookie
Content-Length	以8进制表示的请求体的长度
Content-MD5	请求体的内容的二进制 MD5 散列值（数字签名），以 Base64 编码的结果
Content-Type	请求体的MIME类型 （用于POST和PUT请求中）
Date	发送该消息的日期和时间（以RFC 7231中定义的"HTTP日期"格式来发送）
Expect	表示客户端要求服务器做出特定的行为
From	发起此请求的用户的邮件地址
Host	表示服务器的域名以及服务器所监听的端口号。如果所请求的端口是对应的服务的标准端口（80），则端口号可以省略。
Origin	发起一个针对跨域资源共享的请求（该请求要求服务器在响应中加入一个Access-Control-Allow-Origin的消息头，表示访问控制所允许的来源）。
Pragma	与具体的实现相关，这些字段可能在请求/回应链中的任何时候产生。
Proxy-Authorization	用于向代理进行认证的认证信息。
User-Agent	浏览器的身份标识字符串
Upgrade	要求服务器升级到一个高版本协议。
Via	告诉服务器，这个请求是由哪些代理发出的。
Warning	一个一般性的警告，表示在实体内容体中可能存在错误。

强，协商缓存

缓存方式	获取资源形式	状态码	发送请求到服务器
强缓存	从缓存取	200	否，直接从缓存取
协商缓存	从缓存取	304	是，通过服务器来告知缓存是否可用

强缓存、协商缓存什么时候用哪个

当服务器资源没有变化的时候使用强缓存；当服务器资源发生变化时使用协商缓存。

前端优化

1. 降低请求量：合并资源，减少HTTP 请求数，minify / gzip 压缩，webP，lazyLoad。
2. 加快请求速度：预解析DNS，减少域名数，并行加载，CDN 分发。
3. 缓存：HTTP 协议缓存请求，离线缓存 manifest，离线数据缓存localStorage。
4. 渲染：JS/CSS优化，加载顺序，服务端渲染，pipeline。

GET和POST的区别

传递参数上

• get参数通过url传递，post放在request body中。
• get请求在url中传递的参数是有长度限制的，而post没有。
• get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。

请求上

• get请求只能进行url编码，而post支持多种编码方式
• get请求会浏览器主动cache，而post支持多种编码方式。
• get请求参数会被完整保留在浏览历史记录里，而post中的参数不会被保留。

产生的数据

• GET产生一个TCP数据包；POST产生两个TCP数据包。

HTTP支持的方法

GET, POST, HEAD, OPTIONS, PUT, DELETE, TRACE, CONNECT

HTML5新增的元素

1. 为了更好的实践web语义化，增加了header，footer，nav,aside,section等语义化标签；
2. 在表单方面，为了增强表单，为input增加了color，email,data ,range等类型；
3. 在存储方面，提供了sessionStorage，localStorage,和离线存储，通过这些存储方式方便数据在客户端的存储和获取；
4. 在多媒体方面规定了音频和视频元素audio和vedio；
5. 另外还有地理定位，canvas画布，拖放，多线程编程的web worker和websocket协议

在地址栏里输入一个URL,到这个页面呈现出来，中间会发生什么？

1. 寻找这个URL域名的服务器ip，为了寻找这个ip，游览器首先会寻找缓存，查看缓存中是否有记录，查找顺序为浏览器缓存->系统缓存->路由器缓存，缓存中没有则查找系统的hosts文件中是否有记录，没有则查找DNS服务器
2. 得到IP地址后，根据这个ip以及相应的端口号，构造一个http请求，这个请求报文会包括这次请求的信息，主要是请求方法，请求说明和请求附带的数据，并将这个http请求封装在一个tcp包中，这个tcp包会依次经过传输层，网络层，数据链路层，物理层到达服务器。
3. 服务器解析这个请求来作出响应，返回相应的html给浏览器，游览器根据这个html来构建DOM树和CSSOM树
4. 进行布局，布局主要是确定各个元素的位置和尺寸
5. 渲染页面

简化过程

1. 输入地址，发送至DNS服务器，获取相应的域名和web服务器的IP地址；
2. 与web服务器建立TCP链接;
3. 浏览器向web服务器发送HTTP请求;
4. 服务器响应请求,并发送对应的数据;
5. 浏览器下载数据,并解析源文件,渲染页面,呈现页面

浏览器在生成页面的时候，会生成那两颗树？

构造两棵树，DOM树和CSSOM规则树

当浏览器接收到服务器相应来的HTML文档后，会遍历文档节点，生成DOM树，CSSOM规则树由浏览器解析CSS文件生成，