双击打开HTML文件仅适用于纯静态页面；涉及fetch、XMLHttpRequest、Service Worker等功能时必须用本地服务器运行。推荐Python的http.server或VS Code的Live Server插件，线上平台如CodePen、StackBlitz适合分享但不支持后端逻辑。
直接双击打开 .html 文件就能本地运行，不需要服务器；但涉及 fetch、XMLHttpRequest、localStorage（部分浏览器限制）、Service Worker 等功能时，必须用本地服务器启动，否则会失败。
双击打开：适合纯静态页面，但有严格限制
这是最快速的预览方式，适用于只有 HTML + CSS + 同源 JS（无网络请求、无跨域、不读写本地文件）的页面。
- Chrome / Edge 在
file://协议下默认禁用fetch和XMLHttpRequest对本地文件的请求（报错net::ERR_FILE_NOT_FOUND或Access to script at 'file:///...' from origin 'null' has been blocked） - Firefox 相对宽松，但
Service Worker仍要求http://或https://协议 -
localStorage和sessionStorage在file://下多数浏览器会启用，但每次双击新窗口可能视为不同源，导致数据不共享
本地起服务：推荐用 Python 或 Node.js 快速启动
只要项目含任何异步加载、API 调用、模块导入（import）、或需保持状态，就必须走 http://localhost。
- Python 3 自带
http.server：终端进入项目根目录，运行python -m http.server 8000
，然后访问http://localhost:8000/your-page.html - Node.js 用户可全局安装
serve：npm install -g serve
，再运行serve -s . -p 3000
（-s表示单页应用模式，适合 React/Vue 路由） - VS Code 安装插件
Live Server，右键 HTML 文件 → “Open with Live Server”，自动唤起浏览器并监听文件变化
在线运行：适合分享、协作或快速验证
这些平台不运行你的真实服务器，而是把 HTML/CSS/JS 三块代码拼合成一个沙盒页面，本质仍是静态托管 —— 所以不能跑后端逻辑，也不能访问本地文件或真实 API（除非 CORS 允许）。
ViaooChain 维奥连锁招商网站系统
下载
网站功能资讯模块资料模块会员模块产品展示模块产品订购模块购物车模块留言模块在线加盟模块多级后台管理系统网站环境本系统为 asp.net开发donet版本为1.1框架数据库为acdess2000授权方式为免费，本版本本地可直接运行（使用http://localhost或http://127.0.0.1访问）如需放到外网通过域名访问，则需通过qq联系我免费索取钥匙文件，将钥匙文件放到网站空间根目录即可
立即学习“前端免费学习笔记（深入）”；
-
JSFiddle：支持分栏编辑，但需手动设置
标签位置，外部库要填 CDN 地址 -
CodePen：实时预览友好，但免费账户私有项目不可见，且
fetch到非 HTTPS 接口会被拦截 -
StackBlitz：支持完整 Webpack 构建流程，能跑 Vite/React/Vue 项目，甚至模拟
node-fetch，但上传大文件或复杂依赖会卡顿
常见报错与对应解法
看到这些错误，基本可以判定是协议或路径问题，不是代码写错了：
-
Failed to load resource: net::ERR_FILE_NOT_FOUND→ 说明用了fetch('./data.json')但双击打开，改用本地服务器 -
Access to fetch at 'file:///...' has been blocked→ 同上，浏览器安全策略阻止file://下的 fetch -
Uncaught SyntaxError: Cannot use import statement outside a module→ HTML 中没加type="module"，或本地服务器没配 MIME 类型（Pythonhttp.server默认支持，不用额外处理） -
404 Not Found（在本地服务器中）→ 检查路径是否相对于服务根目录，比如http://localhost:8000/启动，那么./assets/style.css要确保assets/style.css文件真正在当前目录下
真正容易被忽略的是：很多教程里写的“打开 HTML 就行”，只适用于最简 demo；一旦加一行 fetch('/api') 或 import { foo } from './utils.js'，就必须切到本地服务器——这个切换点，比想象中来得早。
