面试官:输入URL之后发生了什么?

URL的组成

1.1 DNS解析查询

服务器都是有自己的IP的,但是IP地址很难记,域名相对比较好记,比如www.baidu.com,那么就需要DNS将IP地址和域名做一个映射。

DNS查找顺序
  • 浏览器自身DNS

  • 操作系统DNS

  • 本地hosts文件

  • 向域名服务器发送请求

DNS查找的规则

配置了CDN,DNS会将最终的域名解析权交给CNAME(别名指向)指向的CDN专用DNS服务器。

1.2 TCP三次握手、四次挥手

前面的篇章已经学习!!!

HTTP请求的方法有以下几种:

  1. GET: 用于请求指定资源,服务器将返回相应资源的内容。GET请求通常用于获取数据,不应该对服务器状态产生任何影响,是幂等的。
  2. POST: 用于向服务器提交数据,常用于提交表单或上传文件等操作。POST请求将请求的数据放在请求体中,相比GET请求可以传输更大量的数据。
  3. PUT: 用于向指定资源位置上传新的内容,或者替换原有资源。PUT请求的主要作用是更新资源,通常用于更新特定资源的全部内容。
  4. DELETE: 用于请求服务器删除指定的资源。DELETE请求将请求的URI所标识的资源从服务器上删除,如果删除成功,则返回204(No Content)状态码。
  5. HEAD: 与GET方法类似,但是服务器在响应中只返回首部,不返回实体的主体部分。HEAD请求常用于获取资源的元数据,如资源的大小、类型等,而不需要获取实际内容。
  6. OPTIONS: 用于获取目标资源所支持的通信选项,即查询服务器支持的HTTP请求方法和其他特性。OPTIONS请求常用于跨域请求的预检查,以确定是否可以发送实际的请求。
  7. PATCH: 用于对资源进行部分修改。PATCH请求的语义与PUT请求类似,但是它只对资源的部分进行更新,而不是替换整个资源。
  8. TRACE: 用于测试请求路径中的代理服务器的性能。TRACE请求会在目标服务器接收到请求后,将请求的内容原样返回给客户端,用于诊断和调试。 这些HTTP请求方法提供了丰富的功能,可以满足不同场景下的需求。
预检请求
触发预检请求
  1. 跨域
  2. 自定义请求头

1.3 缓存

强缓存一般缓存一些静态资源,一般是通过后台去配置的。 多次刷新网页,就会触发内存缓存。

思考?如果两种缓存并存,那个优先级高?

在强缓存中,存在两种常见的缓存机制,即Expires和Cache-Control。当这两种缓存机制同时存在时,Cache-Control的优先级更高。这是因为Cache-Control是HTTP/1.1引入的新特性,具有更灵活的控制选项,能够提供更精细的缓存策略。相比之下,Expires是HTTP/1.0的标准,其缓存控制相对简单,只能指定一个绝对的过期时间点,而无法像Cache-Control那样指定相对时间或其他高级选项。因此,当Expires和Cache-Control同时存在时,浏览器会优先遵循Cache-Control的指令来进行缓存控制。

思考?如果两种缓存并存,那个优先级高?

协商缓存中存在两种常见的缓存验证机制,即Last-Modified和ETag。当这两种机制同时存在时,ETag的优先级更高。这是因为ETag是一种更精确的缓存验证方式,它通过对资源内容的哈希值或其他标识符进行计算,来确定资源是否发生了变化。相比之下,Last-Modified只提供了资源的最后修改时间,存在一定的时间粒度问题,并且在某些情况下可能导致缓存不准确。 因此,当浏览器同时收到Last-Modified和ETag时,它会优先使用ETag进行缓存验证,以确保缓存的准确性和可靠性。

1.4 渲染HTML

1.5 解析JS

字节码的作用:做跨平台

V8用的是JIT解析器,也就是即时编译,还有一个解析器是AOT,将代码直接编译成二进制数据。

1.6 CPU

计算机组成原理:

相关推荐
ywf12151 小时前
前端的dist包放到后端springboot项目下一起打包
前端·spring boot·后端
恋猫de小郭1 小时前
2026,Android Compose 终于支持 Hot Reload 了,但是收费
android·前端·flutter
hpoenixf7 小时前
2026 年前端面试问什么
前端·面试
还是大剑师兰特7 小时前
Vue3 中的 defineExpose 完全指南
前端·javascript·vue.js
泯泷8 小时前
阶段一:从 0 看懂 JSVMP 架构,先在脑子里搭出一台最小 JSVM
前端·javascript·架构
mengchanmian8 小时前
前端node常用配置
前端
华洛9 小时前
利好打工人,openclaw不是企业提效工具,而是个人助理
前端·javascript·产品经理
xkxnq9 小时前
第六阶段:Vue生态高级整合与优化(第93天)Element Plus进阶:自定义主题(变量覆盖)+ 全局配置与组件按需加载优化
前端·javascript·vue.js
A黄俊辉A10 小时前
vue css中 :global的使用
前端·javascript·vue.js
小码哥_常10 小时前
被EdgeToEdge适配折磨疯了,谁懂!
前端