我来帮你排查这个问题——本地运行正常但GitHub Pages上视频无法加载，大概率是Git LFS和GitHub Pages的兼容性限制导致的，结合你的情况，给你几个可行的解决方案：

为什么会出现这个问题？ #

GitHub Pages本质是静态页面托管服务，它只会读取你仓库里的普通文件，但Git LFS存储的文件在仓库里其实是一个指针文件（不是实际的视频内容），GitHub Pages不会自动去解析这个指针并加载LFS存储的实际视频，所以浏览器请求到的只是几行文本指针，自然无法播放。

解决方案1：放弃Git LFS，直接上传视频到仓库（适合小体积视频） #

如果你的视频文件大小在GitHub的普通文件限制内（目前是100MB），可以直接把视频文件提交到仓库：

1. 先取消LFS对这个视频的跟踪：

   git lfs untrack background_video.mp4
   

2. 把实际的视频文件拉到本地仓库目录：

   git lfs pull
   

3. 删除仓库里的LFS指针文件，添加实际视频文件：

   git add background_video.mp4
   

4. 提交并推送到远程仓库：

   git commit -m "Replace LFS pointer with actual video file"
   git push
   

等GitHub Pages重新部署后，视频应该就能正常加载了。

解决方案2：用外部存储托管视频（适合大体积视频） #

如果视频超过100MB，没办法直接上传到仓库，可以把视频放到GitHub Pages支持的外部存储服务，比如：

• GitHub Releases：把视频上传到仓库的Releases里，复制视频的直链，替换HTML里的src属性
• 免费的视频托管服务（比如Cloudinary、Imgur）：上传后获取直链，替换视频路径

举个例子，上传到Releases后，把类似这样的URL替换到HTML中：

<video src="https://github.com/ecoist-ste/pw-version2/releases/download/v1.0/background_video.mp4" autoplay muted loop></video>

额外排查点 #

除了LFS的问题，你还可以检查这两个细节：

• 路径大小写：GitHub是区分文件名大小写的，比如本地的background_video.mp4如果在仓库里写成Background_Video.mp4，就会出现404错误，去仓库里确认文件名完全一致
• 视频编码兼容性：用HandBrake等工具把视频转成H.264编码的MP4格式，这是所有现代浏览器都支持的编码格式，避免因为编码不兼容导致无法播放

验证方法 #

打开GitHub Pages页面的浏览器开发者工具（按F12），切换到「Network」标签，刷新页面后查看视频文件的请求：

• 如果返回404：说明路径错误，或者文件没被正确上传到仓库
• 如果返回200但响应内容是类似version https://git-lfs.github.com/spec/v1的文本：确认是LFS指针问题，需要用上面的方案解决

内容的提问来源于stack exchange，提问作者Steve