html文件需部署到http服务器才可作为网址访问；双击打开走file://协议，导致fetch等前端功能失效；开发时可用live server或http-server启动本地服务；部署至github pages、vercel或netlify可获公网url；注意路径引用与https配置差异。
HTML 文件本身不是网址，它只是本地文件；要变成可访问的网址，必须部署到 HTTP 服务器上。
为什么双击打开的 index.html 地址是 file:/// 开头？
浏览器直接打开本地 HTML 文件时，走的是文件系统协议（file://），不是 HTTP 协议。所有现代前端功能（如 fetch、Service Worker、CORS 策略、相对路径解析）都依赖 http:// 或 https:// 协议，file:// 下基本不可用。
- 常见错误现象：
fetch("./data.json")报错net::ERR_FAILED，或控制台提示Failed to load resource: net::ERR_FILE_NOT_FOUND - 开发阶段临时解决：用轻量 HTTP 服务替代双击——比如 VS Code 安装
Live Server插件，右键“Open with Live Server”，自动起一个http://127.0.0.1:5500服务 - 命令行快速启动（无需安装）：
npx http-server（需先npm install -g http-server），运行后会输出类似Starting up http-server, serving ./和Available on:的地址
怎么把本地 HTML 部署成公网可访问的网址？
本质是把 HTML 文件放到一台持续在线、有公网 IP 或域名映射的 HTTP 服务器上。最常用且免费的方式是托管静态站点。
- GitHub Pages：把项目推送到 GitHub 仓库，开启
Settings → Pages → Source（选main分支 +/ (root)），几秒后生成类似https://<username>.github.io/<repo></repo></username>的网址 - Vercel / Netlify：拖拽上传或连 GitHub 自动部署，支持自定义域名、HTTPS 免费、CDN 加速；Vercel 默认给
https://<project>.vercel.app</project> - 注意路径问题：如果 HTML 中引用了
./css/style.css，在根路径部署（如https://xxx.vercel.app/）没问题；但若部署在子路径（如https://xxx.github.io/myapp/），需改用/myapp/css/style.css或配置base标签
本地开发时，localhost 和 127.0.0.1 有什么区别？
绝大多数情况下没区别，都是指向本机回环地址。但有几个实际影响点容易被忽略：
立即学习“前端免费学习笔记（深入）”；
- 某些浏览器（尤其是 Safari）对
localhost有特殊信任策略，比如允许localStorage、fetch到同域 API；而127.0.0.1可能触发更严格的跨域检查 - HTTPS 本地测试时，
localhost可以用自签名证书（如mkcert生成的）直接信任；127.0.0.1需额外加 Subject Alternative Name 才能被识别 - 部分开发工具（如 Webpack Dev Server）默认只绑定
localhost，不响应127.0.0.1请求，除非显式配置host: "0.0.0.0"
真正卡住人的往往不是“怎么放上去”，而是路径写死、相对引用失效、或者误以为部署完就自动支持 HTTPS —— 实际上 Vercel/Netlify 默认开 HTTPS，但 GitHub Pages 的自定义域名必须手动启用，否则还是 HTTP。
