AbortSignal.timeout() 相比手写 setTimeout 加 AbortController 有什么优势（2022 年起主流浏览器支持）？
围绕“AbortSignal.timeout() 相比手写 setTimeout 加 AbortController 有什”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出一句代码获得自动超时信号且无需手动清理定时器。
核心关键词AbortSignal.timeout 超时 静态方法
面试知识索引 · 分类、标签与搜索
浏览器面试题，301 道完整答案
浏览器面试题第 2 页，显示第 51–100 题，共找到 301 道完整解析，可继续按分类、标签与关键词缩小范围。
301筛选结果
52技术分类
178检索标签
7索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
第 2 页
本页面试问题
按稳定语义路径排序
- 0051
- 0052
什么样的跨域 fetch 请求会触发 CORS 预检（OPTIONS）请求，如何避免不必要的预检？
围绕“什么样的跨域 fetch 请求会触发 CORS 预检（OPTIONS）请求，如何避免不必要的预检”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出非简单方法、非 safelist 头（如 Content-Type: application/json）触发预检及简化为简单请求。
核心关键词CORS 预检 OPTIONS 触发条件 简单请求 - 0053
在 fetch 的 catch 中如何区分请求是被 AbortController 取消还是真的网络失败，为什么要区分？
围绕“在 fetch 的 catch 中如何区分请求是被 AbortController 取消还是真的网络失败，为什么要区”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出检查 error.name === 'AbortError' 且两类错误应采取不同提示与重试策略。
核心关键词区分 AbortError 网络错误 catch name - 0054
fetch 的 mode 选项 cors、no-cors、same-origin 分别产生什么行为？
围绕“fetch 的 mode 选项 cors、no-cors、same-origin 分别产生什么行为”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 no-cors 得到 opaque 响应无法读取内容这一关键陷阱。
核心关键词fetch mode no-cors opaque 响应 - 0055
fetch 默认跨域请求为什么不带 Cookie，credentials 选项各取值有什么区别？
解释 fetch credentials 的三个值 omit、same-origin、include 的行为，重点回答为什么跨域默认不带 Cookie，并说明 include 与 CORS 响应头的配合要求及常见出错点。
核心关键词fetch credentials cookie same-origin include - 0056
为什么 fetch 收到 HTTP 404 或 500 响应时 Promise 不会 reject，应该怎么处理？
解释 fetch 为什么对 404、500 不 reject：Promise 只在网络层失败时拒绝，HTTP 错误状态会正常 resolve。给出检查 response.ok 或 status 并手动抛错的标准处理方式与边界。
核心关键词fetch HTTP 错误不 reject 处理 - 0057
fetch 调用 response.json() 时报错通常有哪些原因，如何健壮处理？
围绕“fetch 调用 response.json() 时报错通常有哪些原因，如何健壮处理”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出响应非 JSON、空 body、body 已被消费三类原因与防御性写法。
核心关键词response.json 解析失败 空响应 - 0058
页面即将卸载时 fetch 请求容易中断，keepalive 选项如何解决这类上报丢失问题？
围绕“页面即将卸载时 fetch 请求容易中断，keepalive 选项如何解决这类上报丢失问题”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 keepalive 让请求在页面卸载后继续发送及其 64KB 体积限制。
核心关键词fetch keepalive 页面卸载 埋点上报 - 0059
fetch 发送 POST 请求时，FormData 与 JSON body 在 Content-Type 和处理上有什么区别？
本题对比 fetch POST 请求中 FormData 与 JSON body 的 Content-Type 差异，强调 FormData 无需手动设置头，JSON 必须声明 application/json，并说明服务端解析依据。
核心关键词fetch POST FormData JSON Content-Type boundary - 0060
fetch 遇到 3xx 重定向时 redirect 选项的 follow、error、manual 各有什么效果？
围绕“fetch 遇到 3xx 重定向时 redirect 选项的 follow、error、manual 各有什么效果”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 manual 在浏览器中得到 opaqueredirect 类型的响应及其限制。
核心关键词fetch redirect manual opaqueredirect - 0061
在支持流式请求体的浏览器中用 fetch 上传 ReadableStream，为什么必须设置 duplex: 'half'（Chrome 105+）？
围绕“在支持流式请求体的浏览器中用 fetch 上传 ReadableStream，为什么必须设置 duplex: 'ha”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出流式上传要求 HTTP/2 或 HTTP/3 且需显式声明 duplex 的兼容性约束。
核心关键词fetch 流式请求体 duplex half ReadableStream 上传 - 0062
为什么 fetch 的 Response body 只能读取一次，需要读两次时怎么办？
解释 Response body 的流式单次消费特性，说明 bodyUsed 的判定与克隆的时机限制。通过实际场景展示如何用 clone 并行处理同一响应，并指出克隆前必须未读取，且克隆后每个对象只能读一次。
核心关键词Response bodyUsed 只能读一次 clone - 0063
fetch 本身没有超时参数，如何实现一个请求超时控制？
fetch没有timeout接口，超时需要借助AbortController加setTimeout实现。本文讲解signal如何生效、定时器清理的必要性、AbortError的判别，并用慢接口场景说明使用方式。
核心关键词fetch 超时 AbortController setTimeout - 0064
为什么原生 fetch 无法监听文件上传进度，有哪些替代方案？
本文说明 fetch 无上传进度事件的原因，对比 XHR upload.progress 和流式字节统计的适用边界，指导进度条实现技术选型。
核心关键词fetch 上传进度 不支持 XHR upload - 0065
浏览器中 fetch 与 XMLHttpRequest 的核心差异是什么，选型时怎么权衡？
对比 fetch 与 XMLHttpRequest 的四个实质差异：Promise 化、HTTP 错误不 reject、上传进度支持、取消机制，并给出按上传进度、错误处理、取消需求选型的可操作判断。
核心关键词fetch 与 XMLHttpRequest 区别 - 0066
HTTP/1.1 下浏览器对同一域名的并发连接数限制如何影响 SSE 和轮询，HTTP/2 如何缓解？
围绕“HTTP/1.1 下浏览器对同一域名的并发连接数限制如何影响 SSE 和轮询，HTTP/2 如何缓解”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出每域约 6 连接、长连接占满会阻塞普通请求、HTTP/2 多路复用可共用一个连接。
核心关键词浏览器 同域名 连接数限制 SSE HTTP/2 多路复用 - 0067
后端以 NDJSON（逐行 JSON）流式返回数据时，前端如何边接收边解析而不是等全部完成？
围绕“后端以 NDJSON（逐行 JSON）流式返回数据时，前端如何边接收边解析而不是等全部完成”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出缓冲未完整行、按换行切分、最后一块收尾的解析逻辑。
核心关键词NDJSON 流式解析 fetch reader 按行切分 - 0068
如何用 fetch 的 response.body.getReader() 逐块读取大文件下载内容并显示进度？
围绕“如何用 fetch 的 response.body.getReader() 逐块读取大文件下载内容并显示进度”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 reader.read() 循环、done 标志与用 Content-Length 计算进度。
核心关键词response.body getReader 分块读取 下载进度 - 0069
前端不再需要 SSE 推送时为什么要显式调用 EventSource.close()，服务端如何感知断开？
围绕“前端不再需要 SSE 推送时为什么要显式调用 EventSource.close()，服务端如何感知断开”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 close 停止自动重连并释放连接、服务端通过连接关闭事件清理订阅资源。
核心关键词EventSource close 关闭 服务端清理 - 0070
SSE 的 text/event-stream 数据格式长什么样，EventSource 如何接收消息？
围绕“SSE 的 text/event-stream 数据格式长什么样，EventSource 如何接收消息”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 data: 行、空行分隔消息的格式与 onmessage 接收。
核心关键词SSE EventSource text/event-stream 格式 - 0071
EventSource 有哪些硬性限制，为什么自定义请求头或 POST 请求做不到？
围绕“EventSource 有哪些硬性限制，为什么自定义请求头或 POST 请求做不到”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出只支持 GET、无法自定义请求头、可用 fetch 流读取替代的边界。
核心关键词EventSource 限制 GET 自定义请求头 - 0072
提前终止 fetch 的流读取时，reader.cancel() 和直接丢弃 reader 有什么区别？
围绕“提前终止 fetch 的流读取时，reader.cancel() 和直接丢弃 reader 有什么区别”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 cancel 会向源头发出取消信号并释放网络资源、仅丢弃 reader 连接仍挂着。
核心关键词reader cancel 取消流 释放连接 - 0073
分块读取流时直接拼接 Uint8Array 转字符串为什么会乱码，TextDecoder 流式解码如何解决？
围绕“分块读取流时直接拼接 Uint8Array 转字符串为什么会乱码，TextDecoder 流式解码如何解决”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出多字节字符可能跨块被截断、TextDecoder 的 stream 选项保留不完整字节。
核心关键词TextDecoder stream true UTF-8 多字节边界 乱码 - 0074
TransformStream 与 pipeThrough 在 fetch 响应处理中适合解决什么问题，举一个具体场景？
围绕“TransformStream 与 pipeThrough 在 fetch 响应处理中适合解决什么问题，举一个具体场”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出在流经过时增量转换数据（如解压、解密、解析）而避免整段缓存的价值。
核心关键词TransformStream pipeThrough 流处理 解压 转换 - 0075
高频发送 WebSocket 消息时为什么需要关注 bufferedAmount，如何处理发送背压？
围绕“高频发送 WebSocket 消息时为什么需要关注 bufferedAmount，如何处理发送背压”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 bufferedAmount 反映未发送字节数、超过阈值应暂停或降频发送避免内存膨胀。
核心关键词WebSocket bufferedAmount 背压 发送队列 - 0076
WebSocket 收发二进制数据时 binaryType 选 blob 还是 arraybuffer，依据是什么？
围绕“WebSocket 收发二进制数据时 binaryType 选 blob 还是 arraybuffer，依据是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 arraybuffer 适合立即处理、blob 适合大文件与流式存储的取舍。
核心关键词WebSocket binaryType blob arraybuffer - 0077
WebSocket 关闭连接时 close(code, reason) 的状态码怎么选，1000 与 1006 有什么区别？
围绕“WebSocket 关闭连接时 close(code, reason) 的状态码怎么选，1000 与 1006 有什”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 1000 正常关闭、1006 异常断开无法手动触发这一诊断价值。
核心关键词WebSocket close code 1000 1006 异常关闭 - 0078
为什么 WebSocket 的 error 事件几乎不携带具体错误信息，实际诊断应该看什么？
围绕“为什么 WebSocket 的 error 事件几乎不携带具体错误信息，实际诊断应该看什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出出于安全规范 error 是通用事件、应结合 close 事件码与 wasClean 及网络面板诊断。
核心关键词WebSocket error 事件 信息少 诊断 close code - 0079
WebSocket 建立连接时的 HTTP 升级握手过程是怎样的，101 状态码代表什么？
围绕“WebSocket 建立连接时的 HTTP 升级握手过程是怎样的，101 状态码代表什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 Upgrade 头、Sec-WebSocket-Key/Accept 校验与 101 Switching Protocols 。
核心关键词WebSocket 握手 Upgrade 101 Sec-WebSocket-Key - 0080
WebSocket 的 open、message、error、close 事件与 readyState 在连接生命周期中如何配合？
围绕“WebSocket 的 open、message、error、close 事件与 readyState 在连接生命周”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出四个 readyState 值与事件触发顺序、必须在 open 后才能 send 的判断。
核心关键词WebSocket readyState open close 生命周期 - 0081
WebSocket 消息本身没有送达确认和重传机制，需要可靠投递时应用层应怎么设计？
围绕“WebSocket 消息本身没有送达确认和重传机制，需要可靠投递时应用层应怎么设计”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出序号加 ACK、超时重发、断线后增量拉取的典型设计。
核心关键词WebSocket 消息 可靠性 确认 重传 应用层 - 0082
设计 WebSocket 客户端的重连与心跳机制时需要考虑哪些要点？
围绕“设计 WebSocket 客户端的重连与心跳机制时需要考虑哪些要点”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出指数退避重连、心跳检测半开连接、区分主动关闭不重建三个要点。
核心关键词WebSocket 重连 心跳 指数退避 ping - 0083
WebSocket 构造函数的第二个参数（子协议）起什么作用，协商失败会怎样？
围绕“WebSocket 构造函数的第二个参数（子协议）起什么作用，协商失败会怎样”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出客户端列出支持的子协议、服务端选一个返回、不匹配时行为取决于服务端实现。
核心关键词WebSocket 子协议 Sec-WebSocket-Protocol 协商 - 0084
实时推送场景下 WebSocket 与 SSE 如何选型，各自的决定性优势是什么？
围绕“实时推送场景下 WebSocket 与 SSE 如何选型，各自的决定性优势是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出双向通信需求选 WebSocket、纯服务端推送且要自动重连与 HTTP 友好选 SSE 的决策依据。
核心关键词WebSocket SSE 选型 实时推送 对比 - 0085
调用 XMLHttpRequest 的 abort() 后，readyState、事件和该对象还能复用吗？
围绕“调用 XMLHttpRequest 的 abort() 后，readyState、事件和该对象还能复用吗”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 abort 后 readyState 归零、触发 abort 事件、对象可重新 open 复用。
核心关键词XHR abort 后 状态 复用 - 0086
XMLHttpRequest 的 readyState 从 0 到 4 各代表什么阶段，onreadystatechange 与 onload 有何不同？
围绕“XMLHttpRequest 的 readyState 从 0 到 4 各代表什么阶段，onreadystatech”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出五个状态含义及 onload 只在完整成功时触发而 readyState 4 可能对应 HTTP 错误。
核心关键词XMLHttpRequest readyState 状态 onload 区别 - 0087
XMLHttpRequest 的 responseType 有哪些取值，下载二进制文件时应该选什么？
围绕“XMLHttpRequest 的 responseType 有哪些取值，下载二进制文件时应该选什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 arraybuffer 与 blob 在二进制下载中的取舍及 text/json 默认行为。
核心关键词XMLHttpRequest responseType blob arraybuffer - 0088
为什么主线程上的同步 XMLHttpRequest 被废弃并应避免使用？
围绕“为什么主线程上的同步 XMLHttpRequest 被废弃并应避免使用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出同步请求冻结主线程 UI 与事件循环、浏览器已计划移除支持。
核心关键词同步 XHR 主线程阻塞 废弃 - 0089
XMLHttpRequest 的 timeout 属性与 ontimeout 事件如何工作，与手动 setTimeout 中断有何区别？
围绕“XMLHttpRequest 的 timeout 属性与 ontimeout 事件如何工作，与手动 setTimeo”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出原生 timeout 从 send 起计时并自动中止触发 ontimeout，无需手动清理定时器。
核心关键词XHR timeout ontimeout 超时 - 0090
XMLHttpRequest 如何分别监听上传进度和下载进度，两个 progress 事件挂在哪个对象上？
围绕“XMLHttpRequest 如何分别监听上传进度和下载进度，两个 progress 事件挂在哪个对象上”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出上传进度挂在 xhr.upload、下载进度挂在 xhr 本身及 e.lengthComputable 判断。
核心关键词XHR upload progress 下载进度 事件 - 0091
什么情况下页面能进入往返缓存（bfcache），pageshow 事件的 persisted 属性如何帮助处理恢复逻辑？
围绕“什么情况下页面能进入往返缓存（bfcache），pageshow 事件的 persisted 属性如何帮助处理恢复逻”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 bfcache 让页面整体冻结恢复而非重新加载、监听 unload 等会使其失效，并用 persisted 区分是否从缓存恢复。
核心关键词bfcache pageshow persisted 往返缓存 - 0092
Element.checkVisibility 与用 offsetParent 或 getClientRects 判断元素是否可见相比，能额外覆盖哪些隐藏情形？
围绕“Element.checkVisibility 与用 offsetParent 或 getClientRects 判”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明它统一检查 display、visibility、content-visibility 等多种不可见来源及 opacity 等选。
核心关键词checkVisibility 元素可见性 判断 - 0093
clientWidth、offsetWidth、scrollWidth 三者分别包含哪些部分，判断元素是否出现溢出该比较哪两个？
围绕“clientWidth、offsetWidth、scrollWidth 三者分别包含哪些部分，判断元素是否出现溢出该”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答需要围绕必须用边框、内边距、滚动内容三个维度区分三者构成，并给出溢出判断的组合。
核心关键词clientWidth offsetWidth scrollWidth 区别 溢出 - 0094
content-visibility:auto 如何跳过屏外内容的布局与绘制，它对滚动条和锚点跳转有什么副作用？
围绕“content-visibility:auto 如何跳过屏外内容的布局与绘制，它对滚动条和锚点跳转有什么副作用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明浏览器用临时标记尺寸延迟渲染屏外子树的机制与 contain-intrinsic-size 的配合。
核心关键词content-visibility auto 跳过渲染 屏外 - 0095
浏览器从收到 HTML 字节到首屏像素的关键渲染路径包含哪些阶段，每个阶段的输入输出是什么？
围绕“浏览器从收到 HTML 字节到首屏像素的关键渲染路径包含哪些阶段，每个阶段的输入输出是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答要按顺序说明解析、样式计算、布局、分层、绘制、栅格化、合成各阶段的产物与依赖。
核心关键词关键渲染路径 DOM CSSOM 渲染树 布局 绘制 合成 - 0096
为什么外部样式表会阻塞首次渲染，而内联脚本必须等待之前的 CSSOM 构建完成？
围绕“为什么外部样式表会阻塞首次渲染，而内联脚本必须等待之前的 CSSOM 构建完成”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释渲染树依赖完整 CSSOM、脚本可能读取计算样式故须等待样式表这两条阻塞链。
核心关键词CSS 阻塞渲染 CSSOM 脚本等待样式表 - 0097
CSS contain 属性的 layout、paint、size 等取值如何让浏览器缩小一次样式变更的重算范围？
围绕“CSS contain 属性的 layout、paint、size 等取值如何让浏览器缩小一次样式变更的重算范围”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 containment 告诉浏览器子树与外部互不影响从而限制回流/重绘边界，且 size 需给定尺寸的前提。
核心关键词CSS contain 布局隔离 渲染性能 - 0098
display:none、visibility:hidden、opacity:0 三种隐藏方式在布局、绘制、命中测试和可访问性上各有什么差异？
围绕“display:none、visibility:hidden、opacity:0 三种隐藏方式在布局、绘制、命中测试”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须逐维度对比是否占布局空间、是否参与绘制、是否响应事件、过渡动画可用性。
核心关键词display none visibility hidden opacity 0 区别 - 0099
document.readyState 的 loading、interactive、complete 三个值分别对应页面加载的什么时刻？
本题解析 document.readyState 的三种值与页面加载阶段的关系：loading 对应当前 HTML 解析未完成，interactive 对应 HTML 解析完成但子资源未完成，complete 对应所有子资源加载完成。并说明利用 readystatechange 替代 DOMContentLoaded 或 load 的用法。
核心关键词document.readyState readystatechange 加载状态 - 0100
DOMContentLoaded 事件与 window 的 load 事件分别等待什么资源，监听哪个会漏掉图片加载完成？
本文解释 DOMContentLoaded 与 window.load 事件等待资源的区别，指出 DOMContentLoaded 不等待图片等子资源，load 事件才代表全部资源完成，并提供具体场景和边界。
核心关键词DOMContentLoaded load 事件区别 资源加载