本地双击打开HTML文件时video标签无法加载本地视频，因浏览器禁用file://协议下的资源加载以保障安全；需通过本地服务器或input文件选择方式解决。
直接用
标签就能嵌入本地视频，但
浏览器
出于安全限制，**双击打开 HTML 文件（即
协议）时，大部分现代浏览器会拒绝加载本地
视频**——这不是写法错，是机制问题。
为什么
在本地双击打不开？
Chrome、Edge、Firefox 默认禁用
下的本地资源加载（包括视频、音频、XMLHttpRequest），防止恶意 HTML 文件读取用户硬盘文件。即使路径完全正确，控制台也会报类似错误：
这不是路径写错了，也不是格式不支持，而是协议层面被拦截。
真正能跑通的两种做法
必须绕过
限制，只有两条路可走：
立即学习
“
前端免费学习笔记（深入）
”；
Comet AI 浏览器
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
用本地开发服务器启动页面（推荐）：比如 Python 的
、Node.
js
的
，让页面运行在
下
改用
让用户手动选视频，再通过
播放——适合上传预览场景，不适用于“默认加载固定本地文件”
硬改浏览器启动参数（如 Chrome 加
）仅限临时调试，不可交付、不跨设备、新版 Chrome 已逐步失效。
标签本身怎么写才稳妥？
写法本身很简单，但要注意兼容性和 fallback：
必须加
属性，否则没播放控件（静音自动播放也需
+
）
推荐同时提供
（H.264）和
（VP9）两种格式，覆盖更多浏览器：
+
不要依赖
在本地环境生效——
下它常被忽略
路径用相对路径（如
），避免绝对路径（
或
）——后者在他人机器上必然失败
调试时最容易卡住的三个点
不是代码不会写，而是卡在这几个“看不见”的环节：
视频文件实际没放在项目目录里，或大小写拼错（
≠
）
用 VS Code Live Server 插件却没右键“Open with Live Server”，还是双击 HTML —— 本质仍是
视频
编码
格式不被浏览器支持：比如用 FFmpeg 导出时选了 AV1 编码（
），Chrome 旧版、Safari 目前都不认
确认是否跑通，最简单的验证方式：打开浏览器开发者工具 → Network 标签页 → 刷新页面 → 看视频文件是否返回 200，而不是 0 或 blocked。
file://srcfile://Not allowed to load local resource: file:///path/to/movie.mp4file://python -m http.serverhttp-serverhttp://localhost:8000URL.createObjectURL()--allow-file-access-from-filescontrolsmutedautoplay.mp4.webmpreload="auto"file://./videos/demo.mp4C:\xxx/home/xxxMovie.MP4movie.mp4file://libsvtav1