H5内的视频播放不了或者只有声音没有画面

最新推荐文章于 2023-11-07 09:16:23 发布
最新推荐文章于 2023-11-07 09:16:23 发布
阅读量5.1k 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： Android 音视频 Webview
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/Connor__AK/article/details/81162233
本文介绍了一个视频播放的问题案例，由于正式视频文件过大导致上传后无法正常播放。通过使用视频压缩软件并将视频编码格式调整为H264，成功解决了这一问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

问题

之前测试上传的小视频是可以播放的，又因为正式的视频太大，压缩了一下上传。后来发现视频播放出现问题

 

解决办法

视频压缩软件将视频输入的视频编码格式改为H264 

Vue3 - 最新实现接入集成萤石摄像头详细流程代码，监控摄像头播放直播流视频控制方向上下左右移动/调节音量声音/全屏/截屏录制/SD卡回放/对讲/清晰度（同一页面多个视频播放多个摄像头画面同时推流）
资深程序员
12-19 1万+
vue3，EZVIZ萤石，vue3萤石云摄像头监控，vue3项目集成萤石云详细示例代码，vue3中使用萤石云播放视频，vue3中使用萤石云播放视频，萤石云实现多窗口监控，展示多个监控画面同时播放，云台控制左右移动，Vue3莹石摄像头直播视频，萤石视频回放，摄像头黑屏不显示，加载慢报错出错，多个摄像头宫格布局，vue3萤石云视频监控对接，实现海康萤石直播预览、回放、云台控制功能，如何利用萤石实现直播推流回流，实时监控播放，监控画面清晰度切换，调节声音大小，全屏放大缩小，云存储SD卡录像，回放功能，截屏，录制视
HTML5中的video视频 在谷歌浏览器显示正常，在其他浏览器中不显示的问题？
最新发布
weixin_48596030的博客
07-18 707
HTML5中video视频 在谷歌浏览器正常显示，在360浏览器和edge中出现只显示声音而没有画面的情况
webview 播放H5视频问题 黑屏 只有声音没有画面
weixin_30477797的博客
09-08 1504
android 用webview 播放网络视频怎控制播放按键？ 在代码中加入webview.getSettings().setJavaScriptEnabled(true);//支持jswebview.getSettings().setPluginsEnabled(true);//设置webview支持插件同时要在Manifest配置文件的application中加入 android:h...
H5的video标签在网页上播放MP4视频时只有声音没有画面
weixin_30413739的博客
01-30 1297
最近做一个项目时，发现mp4文件播放时没有图像，只有声音，代码检查了N次，都没有问题，就算是直接使用网上的实例代码，也只能播放实例视频，mp4文件绝对路径，相对路径也都试了，还是不能播放我的mp4. 最后才想到可能是mp4文件本身的问题， 查询了一下 mp4的视频编码有三种：MPEG4(DivX)，MPEG4(Xvid)，AVC(H264) 只有AVC(H264)编码格式的mp4才可以在网...
H5播放器标签video播放mp4格式有声音没有图像解决方法
liukai6的博客
03-01 4132
在使用h5的video标签播放视频很方便,但是有时会出现有声音没有图像的情况,这个时候我们考虑一下视频编码的问题下载转换工具,对视频进行格式的变化,视频编码选择AVC(H264)这样就可以直接播放了,还可以对很多配置进行转换
解决三星等设备video标签播放hls视频时候只有声音没有视频。。。
一名普通码农的菜地
10-21 6717
No Video on HLS Stream Android 4.4.2 Samsung Galaxy S5 up vote1down votefavorite The HLS streams do not play video, but they do play audio. Device inform
H5页面在手机浏览器上无法播放视频或无法切换视频源的解决方案
旷古的寂寞的博客
01-28 1万+
一、视频无法播放问题 最近做了个播放MP4视频的网页，发现PC端能正常播放视频，但是部分手机浏览器，例如UC浏览器，播放视频要么一直转圈加载，要么报-9324,19000错误。 查了很多资料，基本都是说video标签的参数配置不对或者浏览器版本不兼容，没啥用。 最后发现问题出在网络协议上，H5做的页面在部分手机端的浏览器上只能用http或者websocket协议传输视频数据，不能用https协议。 解决方案就是在video标签中使用完整的http视频链接，即使用http前缀的绝对路径。 <
android h5控制锁屏,WebView播放H5课件时，锁屏解锁后，页面重新绘制的问题
weixin_36182029的博客
05-27 805
难题描述：H5页面播放 ，锁屏，解锁后，重新加载了页面，三星不会出现(onpause onstop ,onresume)，但在小米、魅族会调用 onpause onstop ondestroy,onresume为了解决 ，解锁后能呈现和锁屏前一样的页面，寻找了下横竖屏时的生命周期的问题，解决办法就是 阻止横竖屏的切换在Android 2.3平台上，我们可以需要设置界面的横竖屏显示时，可以在Andr...
解决WebView视屏播放问题记录
安妍妍的博客
03-13 4284
情景项目中有一大板块是加载web页面，开始集成了腾讯的X5内核WebView(因为本身集成了视频播放功能，使用起来比较方便)。但是后来前端大神写了一个web页面用到了&lt;canvas&gt;标签，使用X5加载不出来该标签的内容，因为我们设置了webView关闭了硬件加速( webview.setLayerType(View.LAYER_TYPE_SOFTWARE,null))，今日仔细查看了X...
解决h5的video标签，android、pc客户端播放正常，iphone无法播放
xuepuhao的博客
10-25 8820
在做html5时插入一个视频播放标签video后，测试时android、PC客户端播放正常，唯独ios无法播放。 找了很多办法，把视频转换成mp4各种格式；更换了好几个播放器，发现还是行不通。 之前的做法是，请求一个视频链接，然后默认返回一整个视频文件，此时服务端的做法默认为网页请求的是整个文件。而对于safari来说，他不是一次性请求全部文件的（不论osx还是ios），一般首先会请求0-1字...
【HTML】HTML5 video播放有声音无图像的解决方法
九师兄
11-07 6228
如果以上方法都无法解决问题，建议尝试使用不同的视频播放器或者将视频文件转换为不同的格式，看看是否能够正常播放。不同的浏览器支持不同的视频编码格式，如果视频文件使用了不被浏览器支持的编码，可能会导致只有声音没有视频。而且奇怪的是我试过我们300M到1G之间的视频是有问题的，但是300M以下的，或者1G的视频都是没有问题的。如果你的计算机性能较低，可能无法处理较大的视频文件，导致只有声音没有视频。尝试减小视频的分辨率和帧率，或者使用更高效的压缩算法，以减小文件大小。这个我试过，采用不同的浏览器，都不行。
H5 VIDEO标签视频黑屏的原因及解决方法
02-21 1万+
<video style="width:90%;height:300px;" controls="" poster="/upload/image/20200220/1582177396387987.jpg"> <source src="/upload/video/20200220/pin.mp4" type="video/mp4"/> </v...
h5 页面在ios 手机上，有一些video播放不出来，和其他问题汇总
热门推荐
u013018357的博客
06-30 1万+
最近遇到一个奇怪的问题：同一个video，格式都是mp4 ，在安卓机的 h5 页面上播放没有问题，但是在苹果手机就出现如下图： 开始分析原因： 觉得是转码的原因。于是从视频编辑部 要了 原稿视频原件，自己去下载了一个 转码制作软件，在mac 电脑上转码成mp4 格式 ，然后在ios里面可以播放出来。但问题是为啥在视频编辑部那边制作的视频，有一些不能在ios 上正常播放，莫非是因为我们用的平台不一样...
关于播放器JPlayer的使用及遇到的问题
hgffhh的博客
11-14 1340
关于播放器JPlayer的使用及遇到的问题
手机端h5视频播放踩的一些坑
liusensen00的专栏
12-20 1万+
最近在开发手机h5视频播放器嵌app里，在网上看到一些h5的插件，如video.js,zyMedia..., 个人觉得如果在移动端用的话，没多大必要用这些插件，直接用h5提供的标签就可以了， 官方也提供了很多关于播放器的接口方法。 说一下我遇到的坑吧，由于项目是一个试水的项目，所以公司决定先用MP4格式的视频， 视频是视频提供商提供的，刚开始他们提供了一个视频大小240M，由于网络，带宽一
m3u8流文件在html视频播放器中播放有声音无画面问题
m350058411的博客
10-21 8550
m3u8流文件在html视频播放器中播放有声音无画面问题 前言 最近在做一个海康视频设备直接在网页上播放的功能，由于现在浏览器不支持flash等插件，所以想着将海康的rtsp流先转化为hls流再使用html5来播放直播画面，但是在后台把流转化成hls流的m3u8文件后再到html中播放就出现了有声音没画面的问题，先后试了videojs，hls.js，dplayer等播放器插件，均无法播放画面只有声音。 解决方案 实际上，这个问题是播放器插件和流媒体格式和海康的流媒体格式不一致导致的，市面上大部分的海康流媒体
【Springboot + Vue 视频播放web项目】解决视频播放只有声音没有画面
weixin_40018873的博客
01-31 3194
使用vue-video-player作为视频播放插件，捣鼓挺久de了一堆bug之后终于能读取本地MP4视频文件，但是只有声音没有画面前端也是能够正确地根据url找到文件，音频也是正确的。
微信中h5中的视频无法播放,提示视频解析失败的根本原因。
hhgood的博客
05-12 1万+
提示： 如果你的视频文件所放的服务器装的是apche2.4,那就对了，否则不需要往下看了 微信中的h5中的视频在微信中无法播放，但是你用浏览器打开这个h5地址，却可以播放，原因就是apache没有配置mp4视频不要进行gzip压缩。 在apache的配置中加一行： SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|zip|mp4)$
php视频有声音没画面,Html5-video ，播放视频有声音无画面（微信H5页面）
weixin_32719533的博客
03-28 364
求有过类似开发经验的解惑。。。。问题：在做一个H5视频连续播放页面，在自动播放下一个视频的时候，有时会只有声音无画面，有时又正常，想请问一下大神们是神马原因？如何解决？(针对iPhone就可)测试环境：微信端(iPhone4s，5s)－出现以上问题；PC端(谷歌浏览器模拟移动设备)－未出现问题，所以麻烦回答问题的大神用微信真实环境测试看看，后面我会贴出我的代码。代码：(以下代码有用到zepto.j...
解决H5播放视频黑屏只有声音没有图像的问题
06-13
出现H5播放视频黑屏只有声音没有图像的问题可能有多种原因，以下是几种可能的解决方法： 1. 检查浏览器是否支持视频格式。不同浏览器对视频格式的支持有所不同，可能导致无法正常播放。可以尝试使用其他浏览器或...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值