mediaelement.js/html5视频在前进过多或后退过多时永远保持加载状态
mediaelement.js / html5 video keeps on loading forever when advancing too much or going back too much
我自己的MP4/M4V文件中的mediaelement.js有问题。当我点击搜索栏光标并向前拖动时,电影进展顺利。但如果我向前或向后点击太远,玩家就会进入紧张状态,并永远保持加载。
这个问题出现在Chrome(永远紧张)和IE(需要很长时间加载,但最终又开始播放电影)中。在IE中,它似乎不是逐渐下载的,而在Chrome中,它看起来是这样的,因为当我小心地拖动搜索栏时,它会立即播放)。
我的页面的HTML代码是:
<link rel="stylesheet" type="text/css" href="/Scripts/MediaElement/mediaelementplayer.css" />
<script type="text/javascript" src="/Scripts/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="/Scripts/MediaElement/mediaelement-and-player.min.js"></script>
...
<video id="v1" src="/media/movies/20131201025101_E93D47344CA84A67BE4637ED9B5434D6/10.m4v" controls="controls" width="912" height="404"/>
<script>
var player = new MediaElementPlayer('#v1', {startVolume: 0.8
});
player.play();
</script>
然后我下载了jPlayer的示例视频http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v.我在我的服务器上用MediaElement尝试了一下,然后。。。它工作得很好!
因此,我得出的结论是,这个问题在我的档案中。
MediaInfo报告以下内容:
General
Complete name : 12.m4v
Format : MPEG-4
Format profile : Base Media / Version 2
Codec ID : mp42
File size : 88.9 MiB
Duration : 10mn 35s
Overall bit rate mode : Variable
Overall bit rate : 1 173 Kbps
Encoded date : UTC 2013-12-01 17:14:40
Tagged date : UTC 2013-12-01 17:16:07
Writing application : HandBrake 0.9.9 2013052900
Video
ID : 1
Format : AVC
Format/Info : Advanced Video Codec
Format profile : Baseline@L3.0
Format settings, CABAC : No
Format settings, ReFrames : 3 frames
Codec ID : avc1
Codec ID/Info : Advanced Video Coding
Duration : 10mn 35s
Bit rate mode : Variable
Bit rate : 1 000 Kbps
Width : 512 pixels
Height : 384 pixels
Display aspect ratio : 4:3
Frame rate mode : Constant
Frame rate : 25.000 fps
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Scan type : Progressive
Bits/(Pixel*Frame) : 0.203
Stream size : 76.6 MiB (86%)
Writing library : x264 core 130 r2273 b3065e6
Encoding settings : cabac=0 / ref=3 / deblock=1:0:0 / analyse=0x1:0x111 / me=hex / subme=7 / psy=1 / psy_rd=1.00:0.00 / mixed_ref=1 / me_range=16 / chroma_me=1 / trellis=1 / 8x8dct=0 / cqm=0 / deadzone=21,11 / fast_pskip=1 / chroma_qp_offset=-2 / threads=6 / lookahead_threads=1 / sliced_threads=0 / nr=0 / decimate=1 / interlaced=0 / bluray_compat=0 / constrained_intra=0 / bframes=0 / weightp=0 / keyint=250 / keyint_min=25 / scenecut=40 / intra_refresh=0 / rc_lookahead=40 / rc=abr / mbtree=1 / bitrate=1000 / ratetol=1.0 / qcomp=0.60 / qpmin=0 / qpmax=69 / qpstep=4 / vbv_maxrate=10000 / vbv_bufsize=10000 / nal_hrd=none / ip_ratio=1.40 / aq=1:1.00
Encoded date : UTC 2013-12-01 17:14:40
Tagged date : UTC 2013-12-01 17:16:07
Color primaries : BT.601 NTSC
Transfer characteristics : BT.709
Matrix coefficients : BT.601
Audio
ID : 2
Format : AAC
Format/Info : Advanced Audio Codec
Format profile : LC
Codec ID : 40
Duration : 10mn 35s
Bit rate mode : Variable
Bit rate : 160 Kbps
Maximum bit rate : 192 Kbps
Channel count : 2 channels
Channel positions : Front: L R
Sampling rate : 44.1 KHz
Compression mode : Lossy
Stream size : 12.1 MiB (14%)
Encoded date : UTC 2013-12-01 17:14:40
Tagged date : UTC 2013-12-01 17:16:06
我觉得这很像MediaInfo关于jPlayer示例视频(重命名为11.m4v)的报告:
General
Complete name : 11.m4v
Format : MPEG-4
Format profile : Base Media / Version 2
Codec ID : mp42
File size : 3.87 MiB
Duration : 33s 65ms
Overall bit rate mode : Variable
Overall bit rate : 983 Kbps
Encoded date : UTC 2011-08-30 14:11:40
Tagged date : UTC 2011-08-30 14:11:44
Writing application : HandBrake 0.9.5 2011010300
Video
ID : 1
Format : AVC
Format/Info : Advanced Video Codec
Format profile : Baseline@L3.0
Format settings, CABAC : No
Format settings, ReFrames : 2 frames
Codec ID : avc1
Codec ID/Info : Advanced Video Coding
Duration : 32s 520ms
Bit rate mode : Variable
Bit rate : 867 Kbps
Width : 640 pixels
Height : 360 pixels
Display aspect ratio : 16:9
Frame rate mode : Constant
Frame rate : 25.000 fps
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Scan type : Progressive
Bits/(Pixel*Frame) : 0.150
Stream size : 3.36 MiB (87%)
Writing library : x264 core 112
Encoding settings : cabac=0 / ref=2 / deblock=1:0:0 / analyse=0x1:0x111 / me=hex / subme=6 / psy=1 / psy_rd=1.00:0.00 / mixed_ref=0 / me_range=16 / chroma_me=1 / trellis=0 / 8x8dct=0 / cqm=0 / deadzone=21,11 / fast_pskip=1 / chroma_qp_offset=-2 / threads=12 / sliced_threads=0 / nr=0 / decimate=1 / interlaced=0 / constrained_intra=0 / bframes=0 / weightp=0 / keyint=250 / keyint_min=25 / scenecut=40 / intra_refresh=0 / rc_lookahead=40 / rc=crf / mbtree=1 / crf=20.0 / qcomp=0.60 / qpmin=3 / qpmax=51 / qpstep=4 / ip_ratio=1.40 / aq=1:1.00
Encoded date : UTC 2011-08-30 14:11:40
Tagged date : UTC 2011-08-30 14:11:44
Color primaries : BT.601 NTSC
Transfer characteristics : BT.709
Matrix coefficients : BT.601
Audio
ID : 2
Format : AAC
Format/Info : Advanced Audio Codec
Format profile : LC
Codec ID : 40
Duration : 33s 65ms
Bit rate mode : Variable
Bit rate : 128 Kbps
Maximum bit rate : 149 Kbps
Channel count : 2 channels
Channel positions : Front: L R
Sampling rate : 44.1 KHz
Compression mode : Lossy
Stream size : 515 KiB (13%)
Encoded date : UTC 2011-08-30 14:11:40
Tagged date : UTC 2011-08-30 14:11:44
此外,我已经将moov原子移到了文件的开头。这是AtomicParsley对我的文件的报告:
Atom ftyp @ 0 of size: 28, ends @ 28
Atom moov @ 28 of size: 222456, ends @ 222484
Atom mvhd @ 36 of size: 108, ends @ 144
Atom iods @ 144 of size: 24, ends @ 168
Atom trak @ 168 of size: 96599, ends @ 96767
Atom tkhd @ 176 of size: 92, ends @ 268
Atom mdia @ 268 of size: 96499, ends @ 96767
Atom mdhd @ 276 of size: 32, ends @ 308
Atom hdlr @ 308 of size: 33, ends @ 341
Atom minf @ 341 of size: 96426, ends @ 96767
Atom vmhd @ 349 of size: 20, ends @ 369
Atom dinf @ 369 of size: 36, ends @ 405
Atom dref @ 377 of size: 28, ends @ 405
Atom stbl @ 405 of size: 96362, ends @ 96767
Atom stsd @ 413 of size: 170, ends @ 583
Atom avc1 @ 429 of size: 154, ends @ 583
Atom avcC @ 515 of size: 50, ends @ 565
Atom colr @ 565 of size: 18, ends @ 583 ~
Atom stts @ 583 of size: 24, ends @ 607
Atom stsz @ 607 of size: 63588, ends @ 64195
Atom stsc @ 64195 of size: 28, ends @ 64223
Atom stco @ 64223 of size: 15908, ends @ 80131
Atom stss @ 80131 of size: 732, ends @ 80863
Atom sdtp @ 80863 of size: 15904, ends @ 96767
Atom trak @ 96767 of size: 125606, ends @ 222373
Atom tkhd @ 96775 of size: 92, ends @ 96867
Atom mdia @ 96867 of size: 125484, ends @ 222351
Atom mdhd @ 96875 of size: 32, ends @ 96907
Atom hdlr @ 96907 of size: 33, ends @ 96940
Atom minf @ 96940 of size: 125411, ends @ 222351
Atom smhd @ 96948 of size: 16, ends @ 96964
Atom dinf @ 96964 of size: 36, ends @ 97000
Atom dref @ 96972 of size: 28, ends @ 97000
Atom stbl @ 97000 of size: 125351, ends @ 222351
Atom stsd @ 97008 of size: 103, ends @ 97111
Atom mp4a @ 97024 of size: 87, ends @ 97111
Atom esds @ 97060 of size: 51, ends @ 97111
Atom stts @ 97111 of size: 24, ends @ 97135
Atom stsz @ 97135 of size: 109528, ends @ 206663
Atom stsc @ 206663 of size: 28, ends @ 206691
Atom stco @ 206691 of size: 15660, ends @ 222351
Atom udta @ 222351 of size: 22, ends @ 222373
Atom name @ 222359 of size: 14, ends @ 222373
Atom udta @ 222373 of size: 111, ends @ 222484
Atom meta @ 222381 of size: 103, ends @ 222484
Atom hdlr @ 222393 of size: 33, ends @ 222426
Atom ilst @ 222426 of size: 58, ends @ 222484
Atom ©too @ 222434 of size: 50, ends @ 222484
Atom data @ 222442 of size: 42, ends @ 222484
Atom mdat @ 222484 of size: 92990967, ends @ 93213451
~ denotes an unknown atom
------------------------------------------------------
Total size: 93213451 bytes; 49 atoms total. AtomicParsley version: 0.9.0 (utf16)
Media data: 92990967 bytes; 222484 bytes all other atoms (0.239% atom overhead).
Total free atom space: 0 bytes; 0.000% waste.
------------------------------------------------------
同样,它看起来与jPlayer的示例文件非常相似:
Atom ftyp @ 0 of size: 28, ends @ 28
Atom moov @ 28 of size: 12713, ends @ 12741
Atom mvhd @ 36 of size: 108, ends @ 144
Atom iods @ 144 of size: 24, ends @ 168
Atom trak @ 168 of size: 5484, ends @ 5652
Atom tkhd @ 176 of size: 92, ends @ 268
Atom mdia @ 268 of size: 5384, ends @ 5652
Atom mdhd @ 276 of size: 32, ends @ 308
Atom hdlr @ 308 of size: 33, ends @ 341
Atom minf @ 341 of size: 5311, ends @ 5652
Atom vmhd @ 349 of size: 20, ends @ 369
Atom dinf @ 369 of size: 36, ends @ 405
Atom dref @ 377 of size: 28, ends @ 405
Atom stbl @ 405 of size: 5247, ends @ 5652
Atom stsd @ 413 of size: 170, ends @ 583
Atom avc1 @ 429 of size: 154, ends @ 583
Atom avcC @ 515 of size: 50, ends @ 565
Atom colr @ 565 of size: 18, ends @ 583 ~
Atom stts @ 583 of size: 24, ends @ 607
Atom stsz @ 607 of size: 3272, ends @ 3879
Atom stsc @ 3879 of size: 40, ends @ 3919
Atom stco @ 3919 of size: 832, ends @ 4751
Atom stss @ 4751 of size: 76, ends @ 4827
Atom sdtp @ 4827 of size: 825, ends @ 5652
Atom trak @ 5652 of size: 6978, ends @ 12630
Atom tkhd @ 5660 of size: 92, ends @ 5752
Atom mdia @ 5752 of size: 6856, ends @ 12608
Atom mdhd @ 5760 of size: 32, ends @ 5792
Atom hdlr @ 5792 of size: 33, ends @ 5825
Atom minf @ 5825 of size: 6783, ends @ 12608
Atom smhd @ 5833 of size: 16, ends @ 5849
Atom dinf @ 5849 of size: 36, ends @ 5885
Atom dref @ 5857 of size: 28, ends @ 5885
Atom stbl @ 5885 of size: 6723, ends @ 12608
Atom stsd @ 5893 of size: 103, ends @ 5996
Atom mp4a @ 5909 of size: 87, ends @ 5996
Atom esds @ 5945 of size: 51, ends @ 5996
Atom stts @ 5996 of size: 24, ends @ 6020
Atom stsz @ 6020 of size: 5716, ends @ 11736
Atom stsc @ 11736 of size: 40, ends @ 11776
Atom stco @ 11776 of size: 832, ends @ 12608
Atom udta @ 12608 of size: 22, ends @ 12630
Atom name @ 12616 of size: 14, ends @ 12630
Atom udta @ 12630 of size: 111, ends @ 12741
Atom meta @ 12638 of size: 103, ends @ 12741
Atom hdlr @ 12650 of size: 33, ends @ 12683
Atom ilst @ 12683 of size: 58, ends @ 12741
Atom ©too @ 12691 of size: 50, ends @ 12741
Atom data @ 12699 of size: 42, ends @ 12741
Atom mdat @ 12741 of size: 4050118, ends @ 4062859
~ denotes an unknown atom
------------------------------------------------------
Total size: 4062859 bytes; 49 atoms total. AtomicParsley version: 0.9.0 (utf16)
Media data: 4050118 bytes; 12741 bytes all other atoms (0.314% atom overhead).
Total free atom space: 0 bytes; 0.000% waste.
------------------------------------------------------
尽管有相似之处,但上面提到的两个文件的编码肯定有根本的不同,因为在其中一个文件上搜索总是有效的,而在另一个文件中搜索总是失败的。
也就是说,我的视频文件可能出了什么问题?我如何纠正它(最好使用Handbrake(请注意,MediaInfo报告Handbrake用于编码有效的文件)?
注意:我检查了服务器的MIME类型,并关闭了HTTPGZIP压缩。
提前谢谢。
Dan
这是一个延迟的回答,但可能是因为服务器不接受accept range标头信息(服务器只能请求文件的一部分)。参见:
http://www.cyberciti.biz/cloud-computing/http-status-code-206-commad-line-test/
- 在指令控制器中使用$attrs时出现问题
- 从桌面读取python文件时高亮显示代码
- 当包含另一个asp文件时,是否也包含所有引用的样式和脚本页面
- 在循环中分配json值时,值被覆盖
- JQuery使计数器每次更改时都会增加
- 如何在生成下载文件时显示加载动画
- 使用clickToggle并在单击另一个元素时关闭元素
- 单击时将焦点更改为元素
- 将PHP变量传递给jQuery时遇到问题
- 如何在angularJS中编辑时,如果DB中的值为true,则设置复选框,如果值为false,则取消选中复选框
- 让文本输入幻灯片显示输入时的新文本输入?然后向后滑动
- 单击F5时如何停止页面加载
- 使用压缩的JavaScript文件(不是运行时压缩)
- Touchstart 事件永远不会在网页加载的首次加载时在 Android Chrome 上触发
- ViewState处理程序updateLayout方法在default.js中处理时永远不会被命中
- Jquery上的Promise回调在空响应时永远不会运行
- 导航到页面,scrollTop()总是有效的.刷新页面时,scrollTop()永远不起作用
- 使用超测运行Mocha测试时,Express路由永远不会执行
- 永远不会在服务器重新启动时启动
- 当惰性加载指令时,它'We’我们永远不要跑步