面试之http/html/浏览器

• http和https的区别
  1.https的SSL加密是在传输层实现的。建立一个信息安全通道，来确保数组的传输，确保网站的真实性。
  2.基本概念的区别：加密的http
  3.（1）未加密，明文；加密传输，身份可认证 （2）超文本传输协议；ssl加密传输协议
  （3）费用，证书；链接方式不同，端口号不同
  4.https协议的工作原理？
  5.https的优点：可认证用户和服务器，安全
  6.缺点：握手阶段费时，缓存不如http高，会增加数据开销；SSL证书也需要钱，功能越强大的证书费用越高。SSL证书需要绑定IP，不能再同一个ip上绑定多个域名，ipv4资源支持不了这种消耗。
  7.http2.0：
  （1）提升访问速度（可以对于，请求资源所需时间更少，访问速度更快，相比http1.0）
  （2）允许多路复用：多路复用允许同时通过单一的HTTP/2连接发送多重请求-响应信息。改善了：在http1.1中，浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制（连接数量），超过限制会被阻塞。这个功能相当于是长连接的增强，每个request请求可以随机的混杂在一起，接收方可以根据request的id将request再归属到各自不同的服务端请求里面，另外多路复用中也支持了流的优先级，允许客户端告诉服务器那些内容是更优先级的资源，可以优先传输，
  （3）二进制分帧：HTTP2.0会将所有的传输信息分割为更小的信息或者帧，并对他们进行二进制编码
  （4）首部压缩
  （5）服务器端推送
  （6）内容安全，应为http2.0是基于https的，天然具有安全特性，通过http2.0的特性可以避免单纯使用https的性能下降

• 包含块
  https://www.cnblogs.com/JosephLiao/p/4259997.html

• tcp的三次握手和四次挥手
  https://blog.csdn.net/u012371712/article/details/80795297
  1.会画，知道握手阶段上的几号词什么意思,SYN=1：请求报文 seq:发送信号 ack:希望下一次收到的 ACK：确认（SYN+ACK报文段） FIN=1:表示发发送方已经发送完毕，要求释放连接
  2.可以用语言将过程描述出来，知道为什么要三次和四次？三次：假设第一次连接滞后才发送，那么连接会失效，但是服务器端再收到后就会再建立连接，但是客户端并没有发送连接，就不会发送数据，服务器很多资源就会浪费。四次：tcp为全双工模式，虽然fin后没有数据要发送，但是可以接受数据

3.为什么要等待2MSL？
MSL：报文段最大生存时间，它是任何报文段被丢弃前在网络内的最长时间。保证TCP协议的全双工连接能够可靠关闭；保证这次连接的重复数据段从网络中消失

• tcp和udp的区别？并且因为tcp可靠，面向连接，不会丢失数据因此适合大数据量的交换。；TCP的首部较大为20字节，而UDP只有8字节。
• websocket：
  https://juejin.im/post/5bc7f6b96fb9a05d3447eef8
  https://juejin.im/post/5a4e6a43f265da3e303c4787
  1.WebSocket是基于Http协议的，或者说借用了Http协议来完成一部分握手，在握手阶段与Http是相同的。我们来看一个websocket握手协议的实现，基本是2个属性，upgrade，connection。websocket协议是单独的一个协议，虽然是基于http的，但还是和http是不同的协议。
  2.基本请求：
  GET /chat HTTP/1.1
  Host: server.example.com
  Upgrade: websocket
  Connection: Upgrade
  Sec-WebSocket-Key: x3JJHMbDL1EzLkh9GBhXDw==
  Sec-WebSocket-Protocol: chat, superchat
  Sec-WebSocket-Version: 13
  Origin: http://example.com
  3.可以在浏览器里使用websocket协议，简单，支持双向通信
  4.和http的区别：（我觉得可以从跨域，还有服务端主动发起消息，长连接等说）
  （1）HTTP的生命周期通过Request来界定（请求和响应），也就是Request一个Response，那么在Http1.0协议中，这次Http请求就结束了。在Http1.1中进行了改进，是的有一个connection：Keep-alive，也就是说，在一个Http连接中，可以发送多个Request，接收多个Response。但是必须记住，在Http中一个Request只能对应有一个Response，而且这个Response是被动的，不能主动发起。（但最终还是一个请求对应一个响应，http响应是被动的，但是在websocket里可以主动发起响应？（支持双向通信）http1.1里的connection只是将一个一个的请求合并起来，即可以发送多个请求）
  （2）http的长连接和短连接，短连接即每次通讯都必须三次握手，长连接为在一定时间内保持tcp连接不断开，客户端向服务器端发送大量请求数据，但是必须时客户端是主动的，服务器端是被动的。
  （3）websocket的持久连接：全双工双向通信，只需要建立连接一次。没有同源限制，可以与任何服务器端通讯；较少的控制开销(连接创建后，ws客户端、服务端进行数据交换时，协议控制的数据包头部较少)
  5.因为比较难记，所有写在了本子上
• osi七层参考模型：应用层、表示层、会话层、传输层、网络层、数据链路层、物理层
• 状态码：记不清。。。。
• ajax、fetch、axios:https://juejin.im/post/5cf733f1f265da1baa1e624d 重点是axios
  1.axios（看官方文档）：https://www.kancloud.cn/yunye/axios/234845
  安全性更高,客户端支持防御XSRF
  可以转换(修改，在配置里)请求数据和响应数据,并对响应回来的内容自动转换成JSON类型的数据
  可以拦截请求和响应，可以取消请求

2.fetch：Fetch响应结果的数据格式为:
res.text() 获取字符串形式数据
res.json() 直接获取json数据 //也就是可以获得后台实际返回的内容
理解：（因为返回回来的数据不仅仅包括后台的返回的 Text 内容, 还有一些 Headers. 所以在, then 方法里面返回来的 res 实际上并不是我们在业务中想要的内容. 就和在 XHR 里返回数据是一个道理, 我们最终要的是 responseText 这个数据. 而 json() 方法实际做的事情,就是调用 JSON.parse() 处理数据, 并且返回一个新的 Promise.）
语法简洁,更加语义化
基于标准Promise实现,支持async,await
3.主要区别：
主要区别是axios,fetch请求后都支持Promise对象API,ajax只能用回调函数
axios支持请求/响应拦截,可以自动转换JSON数据
fetch提供了丰富的api,更加底层化
4.fetch发送两次请求的原因：fetch在发送post的请求时总是发送两次，第一次是状态码204，第二次才成功：fetch 第一次发送了一个Options请求，询问服务器是否支持修改的请求头，如果服务器支持，则在第二次中发送真正的请求。

• cookie和localstorage和sessionstorage
• doctype：声明于文档的最前面，告诉浏览器以何种方式渲染页面：严格模式和混杂模式
• http常用请求头：
  1.（http首部）可以将http首部分为通用首部，请求首部，响应首部，实体首部
  通用首部表示一些通用信息，比如date表示报文创建时间，

请求首部就是请求报文中独有的，如cookie，和缓存相关的如if-Modified-Since

响应首部就是响应报文中独有的，如set-cookie，和重定向相关的location，

实体首部用来描述实体部分，如allow用来描述可执行的请求方法，content-type描述主题类型，content-Encoding描述主体的编码方式
2.Accept
可接受的响应内容类型（Content-Types）。
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），则端口号可以省略。
If-Match
仅当客户端提供的实体与服务器上对应的实体相匹配时，才进行对应的操作。主要用于像 PUT 这样的方法中，仅当从用户上次更新某个资源后，该资源未被修改的情况下，才更新该资源。
If-Modified-Since
允许在对应的资源未被修改的情况下返回304未修改
If-None-Match
允许在对应的内容未被修改的情况下返回304未修改（ 304 Not Modified ），参考 超文本传输协议 的实体标记
If-Range
如果该实体未被修改过，则向返回所缺少的那一个或多个部分。否则，返回整个新的实体
If-Unmodified-Since
仅当该实体自某个特定时间以来未被修改的情况下，才发送回应。
Max-Forwards
限制该消息可被代理及网关转发的次数。
Origin
发起一个针对跨域资源共享的请求（该请求要求服务器在响应中加入一个Access-Control-Allow-Origin的消息头，表示访问控制所允许的来源）。
Pragma
与具体的实现相关，这些字段可能在请求/回应链中的任何时候产生。
Proxy-Authorization
用于向代理进行认证的认证信息。
Range
表示请求某个实体的一部分，字节偏移以0开始。
Referer
表示浏览器所访问的前一个页面，可以认为是之前访问页面的链接将浏览器带到了当前页面。Referer其实是Referrer这个单词，但RFC制作标准时给拼错了，后来也就将错就错使用Referer了。
TE
浏览器预期接受的传输时的编码方式：可使用回应协议头Transfer-Encoding中的值（还可以使用"trailers"表示数据传输时的分块方式）用来表示浏览器希望在最后一个大小为0的块之后还接收到一些额外的字段。
User-Agent
浏览器的身份标识字符串
Upgrade
要求服务器升级到一个高版本协议。
Via
告诉服务器，这个请求是由哪些代理发出的。
Warning
一个一般性的警告，表示在实体内容体中可能存在错误

• （浏览器缓存）强缓存和协商缓存
  1.https://www.jianshu.com/p/47f3406c8084?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation
  2.https://www.jianshu.com/p/fb59c770160c

• 1.get和post区别：
  get参数通过url传递，post放在request body中。
  get请求在url中传递的参数是有长度限制的，而post没有。
  get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。
  get请求只能进行url编码，而post支持多种编码方式
  get请求会浏览器主动cache，而post支持多种编码方式。
  get请求参数会被完整保留在浏览历史记录里，而post中的参数不会被保留。
  GET和POST本质上就是TCP链接，并无差别。但是由于HTTP的规定和浏览器/服务器的限制，导致他们在应用过程中体现出一些不同。
  GET产生一个TCP数据包；POST产生两个TCP数据包
  2.get和post在缓存方面的区别：
  get请求类似于查找的过程，用户获取数据，可以不用每次都与数据库连接，所以可以使用缓存。
  post不同，post做的一般是修改和删除的工作，所以必须与数据库交互，所以不能使用缓存。因此get请求适合于请求缓存。
  3.关于get和post在长度方面的误区：GET的最大长度显示是因为 浏览器和 web服务器限制了 URI的长度
  不同的浏览器和WEB服务器，限制的最大长度不一样

• html5新增的元素

• 在一个地址栏里输入URL后会发生什么