【Springboot + Vue 视频播放web项目】解决视频播放只有声音没有画面-Toy模板网

这篇具有很好参考价值的文章主要介绍了【Springboot + Vue 视频播放web项目】解决视频播放只有声音没有画面。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

问题描述：

使用vue-video-player作为视频播放插件，捣鼓挺久de了一堆bug之后终于能读取本地MP4视频文件，但是只有声音没有画面 video只有声音没有画面,前端,vue.js,音视频,spring boot
前端也是能够正确地根据url找到文件，音频也是正确的

经过前端堂哥的指点，首先把上面这个url直接输入到浏览器，看能不能正常播放，结果也是只有声音没有画面，于是堂哥断定：
*

不是前端的问题！

哈哈哈哈哈哈哈这就是前端程序员的基本素养吗哈哈哈哈，牛牛牛，起码帮我缩小了范围
经过很多查找，锁定了视频编码这个问题，具体可以看这个帖子和这个帖子
总的来说，原因就是：

我的MP4视频编码是mpeg4，这个格式的编解码好像要收取专利费，所以chrome等浏览器不支持

查看视频的编码方式（光在win的文件系统里是看不出来的）：

1、我是用爱奇艺万能播放器，播放这个视频然后右键查看信息； 2、使用ffmpeg查看

在java里面通过命令行使用ffmpeg转码，将mpeg4编码的MP4文件转换成h264编码的MP4文件

具体可以参考这个帖子得到如何在java里模拟命令行调用，具体的转码指令根据需要自己查，我的是这个：

ffmpeg -i src.mp4  -vcodec h264 output.mp4

整个过程还是很艰辛的，涉及到很多内容，有机会再把这些细节做一个总结
有问题欢迎大家指出文章来源地址https://www.toymoban.com/news/detail-590623.html

到了这里，关于【Springboot + Vue 视频播放web项目】解决视频播放只有声音没有画面的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！