<base> 标签仅在 HTML 解析阶段生效，不改写 URL 也不影响 JS 运行时；无效 href 值（如无协议、含 ..、结尾缺 /）会被静默忽略，导致相对路径回退至页面 URL 解析，引发高 404 风险。
<base> 标签只在 HTML 解析阶段生效，它不重写 URL，也不影响 JS 运行时行为；如果你写了无效的 href 值，浏览器会静默忽略整条 <base>，后续所有相对路径仍按当前页面 URL 解析——404 风险极高，且毫无提示。
base href 必须是绝对 URL 或根相对路径
浏览器只接受以 http://、https://、// 或 / 开头的 href 值。其他写法一律被丢弃：
-
href="assets/"→ 缺协议和域名，被忽略 -
href="../css/"→ 含..，被忽略 -
href="https://example.com"→ 结尾没/，Firefox/Opera 会截断路径（如css/app.css变成css/app.css被拼成https://example.comcss/app.css） -
href="/subapp"→ 结尾没/，同上风险；正确应为href="/subapp/"
哪些资源受 base 影响，哪些完全不受
<base> 只改写 HTML 中纯相对路径（即不以 /、: 或协议开头）的初始解析逻辑：
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- ✅ 受影响：
<img src="logo.png">、<link href="style.css">、<a href="about.html">、<form action="login.php">、CSS 中的background: url(avatar.jpg) - ❌ 完全不受：
fetch('./api/user')、import('./utils.js')、new Worker('./worker.js')、@import "reset.css"、<iframe src="page.html"> - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于构造 URL（如new URL('data.json', document.baseURI)），但window.location和document.URL完全不变
多级目录部署时 base 与前端路由、构建工具的协同陷阱
SPA 部署在子路径（如 https://example.com/a/b/c/）时，<base href="/a/b/c/"> 和前端路由配置必须严格对齐：
立即学习“前端免费学习笔记（深入）”；
- Vue Router / React Router v6+ 必须显式设
base: '/a/b/c/'，否则router.push('/home')会跳到根路径 - Webpack 的
publicPath和 HTML 的<base href>若同时配置且值相同，资源路径可能被拼两次（如/a/b/c//a/b/c/js/app.js） - Vite 构建时若用
base: '/a/b/c/'，HTML 中就不该再手动写<base href="/a/b/c/">，否则重复 - Service Worker 缓存策略若依赖
self.location.origin + '/a/b/c/'，而 HTML 没配<base>，预缓存路径就错位
最容易被忽略的是：本地开发时用 http://localhost:3000/ 作 href 比用 / 更安全，能避免和后端路由冲突；而生产环境走 CDN 时，用完整绝对 URL（如 https://cdn.example.com/v2.3/）比根相对路径更可控。
