Http 面试知识点

一、从URL输入到页面显示发生了什么？

首先进行DNS查询，查询到域名对应的IP

接下来是TCP的三次握手，

当 TCP 握手结束后就会进行 TLS 握手，然后就开始正式的传输数据

数据在进入服务端之前，可能还会先经过负责负载均衡的服务器，它的作用就是将请求合理的分发到多台服务器上，这时假设服务端会响应一个 HTML 文件。

首先浏览器会判断状态码是什么，如果是 200 那就继续解析，如果 400 或 500 的话就会报错，如果 300的话会进行重定向，这里会有个重定向计数器，避免过多次的重定向，超过次数也会报错。

浏览器开始解析文件，如果是 gzip 格式的话会先解压一下，然后通过文件的编码格式知道该如何去解码文件。

文件解码成功后会正式开始渲染流程，先会根据 HTML 构建 DOM 树，有 CSS 的话会去构建 CSSOM 树。如果遇到 script 标签的话，会判断是否存在 async 或者 defer ，前者会并行进行下载并执行 JS，后者会先下载文件，然后等待 HTML 解析完成后顺序执行。

CSSOM 树和 DOM 树构建完成后会开始生成 Render 树，这一步就是确定页面元素的布局、样式等等诸多方面的东西

在生成 Render 树的过程中，浏览器就开始调用 GPU 绘制，合成图层，将内容显示在屏幕上了。

二、缓存相关，例如 no-cache 和 no-store的区别

no-store：不缓存任何响应 no-cache: 资源会被缓存，但会立即失效，下次会发起请求验证资源是否过期

三、浏览器有几种缓存，什么时候使用缓存？

Service Worker

Memory Cache 内存中的缓存

Disk Cache 硬盘中的缓存

Push Cache

网络请求

四、cookie/session的区别，cookie的参数有哪些，http-only关注下

浏览器的同源政策规定，两个网址只要域名相同和端口相同，就可以共享 Cookie（参见《同源政策》一章）。注意，这里不要求协议相同。也就是说，example.com设置的 Cookie，可以被https://example.com读取。

• path属性必须为绝对路径，默认为当前路径。
• domain属性值必须是当前发送 Cookie，的域名的一部分。比如，当前域名是example.com，就不能将其设为foo.com。该属性默认为当前的一级域名（不含二级域名）。
• max-age属性的值为秒数。
• expires属性的值为 UTC，格式，可以使用Date.prototype.toUTCString()进行日期格式转换。

五、CDN能为什么可以做到性能优化？

六、状态码，301和302的区别

七、web安全机制，XSS/CSRF

xss跨站脚本攻击

csrf跨站轻轻伪造

xss最常见的就是评论功能，不要相信用户的任何输入，这里做下替换

const filterXss = (str) => {
    if (typedef str !== 'string') {
        return str
    }
    str = str.replace(/\</g, '&gt;').replace(/\>/, '&lt;').replace(/\"/, '&quot;')
    return str                                                             
}
复制代码

八、TCP三次握手，四次挥手原理

九、http2.0有哪些新特性？解决了什么问题？ http3.0呢？

参考：juejin.im/post/5a4dfb…

• 二进制分帧
• 首部压缩
• 流量控制
• 多路复用
• 请求优先级
• 服务器推送

在 HTTP/1 中，为了性能考虑，我们会引入雪碧图、将小图内联、使用多个域名等等的方式。这一切都是因为浏览器限制了同一个域名下的请求数量（Chrome 下一般是限制六个连接），当页面中需要请求很多资源的时候，队头阻塞（Head of line blocking）会导致在达到最大请求数量时，剩余的资源需要等待其他资源请求完成后才能发起请求。

HTTP/2 中引入了多路复用的技术，这个技术可以只通过一个 TCP 连接就可以传输所有的请求数据。多路复用很好的解决了浏览器限制同一个域名下的请求数量的问题，同时也间接更容易实现全速传输，毕竟新开一个 TCP 连接都需要慢慢提升传输速度。

十、浏览器跨域请求有哪些解决方式？

转载于:https://juejin.im/post/5cf773526fb9a07eda03062f