元素的 src 跨域请求被拒是因 VTT 文件响应头缺失 Access-Control-Allow-Origin 和 Content-Type: text/vtt；HTML 中 track 不支持 crossorigin 属性；file:// 协议下必然失败，须用 HTTP 服务。
track src 跨域请求被拒的典型错误
浏览器对 <track></track> 的 src 发起的是独立跨域请求，和视频本身无关。常见现象是：字幕菜单为空、控制台报 Failed to load resource: No 'Access-Control-Allow-Origin' header，但页面其他资源（如 JS/CSS）正常——说明问题只出在 VTT 文件响应头缺失。
服务端必须返回 Access-Control-Allow-Origin
如果视频在 https://site.com，而字幕放在 https://cdn.site.com/zh.vtt，则 CDN 必须在响应中包含以下至少一项：
-
Access-Control-Allow-Origin: https://site.com（精确匹配） -
Access-Control-Allow-Origin: *（仅当无 credentials 时有效） - 若前端设置了
crossorigin="anonymous"，还需加Access-Control-Allow-Headers: *和Access-Control-Allow-Methods: GET
注意：Access-Control-Allow-Origin: * 与带 cookie 的请求互斥；若需鉴权，必须指定源且不能用通配符。
HTML 中 track 标签无需写 crossorigin 属性
<track></track> 元素不支持 crossorigin 属性（该属性只对 <script></script>、<img alt="HTML track元素跨域加载WebVTT的配置方法" >、<link> 等生效）。强行添加不会报错，但也不起作用——跨域控制完全依赖服务端响应头。
立即学习“前端免费学习笔记（深入）”；
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
验证方式：直接在浏览器地址栏打开 https://cdn.site.com/zh.vtt，打开开发者工具 → Network → 查看响应头中是否含 Access-Control-Allow-Origin。
本地开发时 file:// 协议必然失败
双击 HTML 文件用 file:// 打开时，所有 <track src="xxx.vtt"></track> 加载都会静默失败，这是 Chrome/Firefox 的硬性限制，与 CORS 配置无关。
必须启用本地 HTTP 服务：
python3 -m http.server 8000- VS Code Live Server 插件
- 任何能提供
http://localhost:xxxx的服务
否则，哪怕 VTT 文件和 HTML 在同一目录，也加载不了。
最容易被忽略的是：服务端不仅得配 CORS，还得确保 Content-Type: text/vtt 同时存在。缺任一，Safari 可能解析失败，Chrome 则可能静默跳过——这两个响应头是绑定生效的。
