video标签无法加载本地文件是因file://协议被浏览器安全策略限制，需用http/https服务；路径须相对HTML文件且用正斜杠；MP4需H.264+AAC编码；跨域需服务端配置CORS头；自动播放须加muted属性。
video 标签不加载本地文件？路径和协议是关键
直接双击 HTML 文件打开时，video 标签无法播放 file:// 协议下的本地视频，浏览器会因安全策略拒绝加载——这不是代码写错了，是协议限制。
- 用
http://或https://（比如通过python -m http.server启动本地服务）才能正常加载src="video.mp4" -
src路径必须相对当前 HTML 文件位置，不是相对于你“觉得它应该在”的位置；常见错误是把视频放错文件夹却反复改src写法 - Windows 下别用反斜杠
\，一律用正斜杠/：写成src="assets/video.mp4"，不是src="assets\video.mp4"
MP4 播不了？检查编码格式和 MIME 类型
即使路径对、协议对，video 标签仍静音或显示黑屏，大概率是视频没用浏览器支持的编码——MP4 容器不等于一定能播，关键是里面的视频流是否为 H.264，音频流是否为 AAC。
- 用
ffprobe video.mp4查看编码：关注输出里Video: h264和Audio: aac - 用
ffmpeg -i input.mp4 -c:v libx264 -c:a aac -movflags +faststart output.mp4重编码最稳妥 - 如果走本地服务器，确保服务器返回正确的
Content-Type：MP4 应为video/mp4，否则某些浏览器（如 Safari）会拒绝解析
在线视频跨域失败？加 crossorigin 不等于能解
从其他域名加载视频时，控制台报 Failed to load resource: net::ERR_FAILED 或提示 CORS 错误，说明响应头没开权限——光在 video 标签加 crossorigin 属性没用，服务端必须配合。
- 加
crossorigin="anonymous"是前提，但真正起作用的是服务器响应头是否包含Access-Control-Allow-Origin: *（或指定域名） - CDN 或对象存储（如 S3、OSS）需手动配置 CORS 规则，不能只改前端标签
- 如果只是想预览，且视频源可控，优先用同源地址；跨域仅在必要时引入，别为了“看起来高级”硬加
crossorigin
自动播放被阻止？muted 是硬性条件
Chrome、Safari 等现代浏览器默认禁止有声音的自动播放，哪怕写了 autoplay，也会静音或直接停在首帧——这不是 bug，是策略。
- 要实现自动播放，必须同时加
autoplay和muted： - 如果需要带声播放，只能靠用户首次交互（如点击按钮）后调用
play()方法，且该调用必须在事件回调内，不能延迟或丢到setTimeout里 -
playsinline在 iOS Safari 上很重要，否则视频会强制全屏，影响布局
有些问题看着像 HTML 写得不对，其实是协议、编码、响应头或浏览器策略在拦路。改一行 src 不解决路径错，加十个属性也绕不过 H.264 编码要求。动手前先搞清哪一层在报错，比盲目试更省时间。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
