一、項目場景：
在Vue項目中使用Video.js播放MP4視頻。
二、問題描述
在項目中使用Video.js播放MP4視頻。視頻采集上來存在數(shù)據(jù)庫，前端使用Video.js對視頻進行播放。突然有一天，MP4視頻播放不了，并且報錯：
VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) No compatible source was found for this media.
三、原因分析：
并發(fā)現(xiàn)前一時間段采集到的MP4視頻可以播放，最近的采集的視頻不能播放。文章來源：http://www.zghlxwxcb.cn/news/detail-851430.html
- 首先視頻播放不了第一時間想到的就是路徑不對，通過打斷點和conse.log()查看日志，查看下是不是路徑拼錯了，仔細檢查后發(fā)現(xiàn)并不是路徑錯誤。
- 其次，在網(wǎng)上找了在線MP4視頻，查看是不是Videojs的問題。測試路徑可以使用下面測試：
https://cesium.com/public/SandcastleSampleData/big-buck-bunny_trailer.mp4
視頻預(yù)覽
視頻可以正產(chǎn)播放，并不是Video.js的問題 - 最后，考慮到視頻格式的問題，因為Video.js 支持的視頻格式：MP4（包括 mp4 和 m4a 文件）、WebM（包括 webm 和 vtt 文件）、OGG（包括 ogg 和 theora 文件）、FLV、RTMP。需要注意的是，盡管某些 MP4 文件可能具有 MPEG-4或 H.264（AVC）編碼，但 Video.js 只支持帶有 H.264（AVC）編碼的 MP4 文件。如在 Video.js 中播放其他編碼的視頻，可能需要轉(zhuǎn)換為H.264 （AVC）編碼或者確保在錄制時設(shè)置正確的編碼。發(fā)現(xiàn)之前前后的MP4視頻編碼不一致，確定是視頻編碼問題。
四、解決方案：
通過PotPlayer查看可以正常播放的視頻和不能播放視頻的視頻格式，果真是 H.264 （AVC）格式。
解決辦法為視頻采集端把MPEG-4編碼格式轉(zhuǎn)換成 H.264 （AVC）編碼格式就可以使用Video.js正常播放MP4視頻了。
Video.js 正常播放MP4視頻格式：
Video.js 播放不了MP4視頻格式：
文章來源地址http://www.zghlxwxcb.cn/news/detail-851430.html
到了這里，關(guān)于【記錄處理Vue項目中Video.js播放不了MP4視頻Bug】的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
