Re: [请益] AWS S3 signed url影片问题

楼主: qrtt1 (有些事,有时候。。。)   2016-10-06 19:17:22
※ 引述《b510336 (风的细语)》之铭言:
: 大家如果茶余饭后有点小空的话
: 可以帮我测测这页的影片可不可以播放吗?
: 可以的话顺便告诉我一下你的浏览器跟网络环境(有线无线,网速等)
: https://www.dcplus.com.tw/marketing-training/78934
: 我目前采用AWS S3的方式放置影片
: 后端的node去跟s3拿到signed url然后传给前端的播放器
: expire设定为两小时
: 但是有人反应无法播放
: 我自己测或是找认识的测都说可以播放
: 目前不晓得到底是什么问题
: 如果大家有空帮测一下就太感恩了~
在我的电脑测大致没问题,但看 html 跟档案有些细节没处理的说。
你是这么写:
<video src="http://awsdcplus.s3.amazonaws.com/20160111...."
class="fp-engine" autoplay="" preload="none"
x-webkit-airplay="allow"></video>
(虽然好像有用 flowplayer 但播不了应该能 fallback to flash!?)
假设你是单纯用 video tag 处理,那这段 code 就不太够用了。
因为不同的 {平台, 浏览器, 版本} 支援的 {container, codecs} 组合不太一样。
透过 ffprobe 看了一下,你用的是很标准的 mp4:
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'JJ.mp4':
Metadata:
major_brand : isom
minor_version : 512
compatible_brands: isomiso2avc1mp41
creation_time : 2016-02-15 11:27:50
encoder : Lavf54.63.104
Duration: 00:18:15.48, start: 0.000000, bitrate: 818 kb/s
Stream #0:0(und): Video: h264 (Main) (avc1 / 0x31637661), yuv420p, 1280x720 [SAR 1:1 DAR 16:9], 661 kb/s, 25 fps, 25 tbr, 12800 tbn, 50 tbc (default)
Metadata:
creation_time : 2016-02-15 11:27:50
handler_name : VideoHandler
Stream #0:1(und): Audio: aac (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 151 kb/s (default)
Metadata:
creation_time : 2016-02-15 11:27:50
handler_name : SoundHandler
若是 mobile 或是 osx 大致没什么问题,但不能预测它是否真的没问题。
(中肯的废话)
所以,得要处理一下例外的情况:
1. 准备不同的 container + codecs 的档案
2. 都没有东西能播的时候,你要收到通知
先谈 [2] 可以参考
[MDN] Using HTML5 audio and video
https://mzl.la/2d5qLkw
其中的 Error Handling 就有交你透过 <source> 准备 [1] 的东西。
还有要透过 "error" event 来收诊断资讯(以下是复制网页内容的)
var v = document.querySelector('video'),
sources = v.querySelectorAll('source'),
lastsource = sources[sources.length-1];
lastsource.addEventListener('error', function(ev) {
var d = document.createElement('div');
d.innerHTML = v.innerHTML;
v.parentNode.replaceChild(d, v);
// 它的实作把它改掉,
// 改成 call 你自己的 api 做 error report 蒐集诊断资讯
// 这东西不该靠稀少的乡民测试,一旦使用者最初的状态是失败的
// 也许就没有再回来的一天
// 但你至少能得到诊断资讯,即使不解决,你也知道出错的比例,决定紧急程度
}, false);
那么回头 [1] 谈该准备什么内容,就直接看转档服务的建议吧(让专业的来!?)
https://app.zencoder.com/docs/guides/encoding-settings/html5
What web formats?
There are three video formats that work natively in some browsers.
Unfortunately, no format works in all browsers,
so you need to do at least two if you want meaningful HTML5 video support.
Minimally, you must use MP4 + H.264, with AAC or MP3.
MP4 video plays natively in Safari, Chrome, and IE9 (Vista/Windows 7).
It is also your best option for a Flash video fallback,
and plays natively on many devices
(iOS, Android, Blackberry, PSP, Xbox, PS3, etc.).
Use H.264 High Profile for the best quality,
or Baseline profile if you want the same video to be playable
on mobile devices.
Beyond that, use either WebM + VP8 or Ogg + Theora with Vorbis audio
for other browsers.
Recommendation: Minimally, MP4 + either WebM or Ogg, or maybe both.
(简单说,再加上 WebM 会好些。)
===========================================================================
其他问题:
1. 若你有用商用的 player 元件,先查手册或问客服的建议
2. 该查一下为什么没有 fallback to flash player
(看起来你不像写纯 video tag)
3. 你的 MP4 不太优,index data 没在档案前头
moov 的 offset 是 111323826,档案大小是 112025209
(那就是单纯的未最佳化的 mp4,影响起播速度)
(player 要有 moov 里的资讯才能播放,
第 1 次 request 取不到,需要再多打 request 去查到 moov 并取回来
实作比较“杯具”的 player 就会全下载回来再开播
不过,这年代应该不太会发生这样的事了,
但也是一种“假的”播不了的情况)
qty:Downloads qrtt1$ ./AtomicParsley-MacOSX-0.9.0/AtomicParsley JJ.mp4 -T
Atom ftyp @ 0 of size: 32, ends @ 32
Atom free @ 32 of size: 8, ends @ 40
Atom mdat @ 40 of size: 111323786, ends @ 111323826
Atom moov @ 111323826 of size: 701383, ends @ 112025209
Atom mvhd @ 111323834 of size: 108, ends @ 111323942
Atom trak @ 111323942 of size: 220133, ends @ 111544075
Atom tkhd @ 111323950 of size: 92, ends @ 111324042
Atom edts @ 111324042 of size: 36, ends @ 111324078
Atom elst @ 111324050 of size: 28, ends @ 111324078
Atom mdia @ 111324078 of size: 219997, ends @ 111544075
Atom mdhd @ 111324086 of size: 32, ends @ 111324118
Atom hdlr @ 111324118 of size: 45, ends @ 111324163
Atom minf @ 111324163 of size: 219912, ends @ 111544075
Atom vmhd @ 111324171 of size: 20, ends @ 111324191
Atom dinf @ 111324191 of size: 36, ends @ 111324227
Atom dref @ 111324199 of size: 28, ends @ 111324227
Atom stbl @ 111324227 of size: 219848, ends @ 111544075
Atom stsd @ 111324235 of size: 148, ends @ 111324383
Atom avc1 @ 111324251 of size: 132, ends @ 111324383
Atom avcC @ 111324337 of size: 46, ends @ 111324383
Atom stts @ 111324383 of size: 24, ends @ 111324407
Atom stss @ 111324407 of size: 488, ends @ 111324895
Atom stsc @ 111324895 of size: 52, ends @ 111324947
Atom stsz @ 111324947 of size: 109568, ends @ 111434515
Atom stco @ 111434515 of size: 109560, ends @ 111544075
Atom trak @ 111544075 of size: 481036, ends @ 112025111
Atom tkhd @ 111544083 of size: 92, ends @ 111544175
Atom edts @ 111544175 of size: 36, ends @ 111544211
Atom elst @ 111544183 of size: 28, ends @ 111544211
Atom mdia @ 111544211 of size: 480900, ends @ 112025111
Atom mdhd @ 111544219 of size: 32, ends @ 111544251
Atom hdlr @ 111544251 of size: 45, ends @ 111544296
Atom minf @ 111544296 of size: 480815, ends @ 112025111
Atom smhd @ 111544304 of size: 16, ends @ 111544320
Atom dinf @ 111544320 of size: 36, ends @ 111544356
Atom dref @ 111544328 of size: 28, ends @ 111544356
Atom stbl @ 111544356 of size: 480755, ends @ 112025111
Atom stsd @ 111544364 of size: 103, ends @ 111544467
Atom mp4a @ 111544380 of size: 87, ends @ 111544467
Atom esds @ 111544416 of size: 51, ends @ 111544467
Atom stts @ 111544467 of size: 32, ends @ 111544499
Atom stsc @ 111544499 of size: 182332, ends @ 111726831
Atom stsz @ 111726831 of size: 188720, ends @ 111915551
Atom stco @ 111915551 of size: 109560, ends @ 112025111
Atom udta @ 112025111 of size: 98, ends @ 112025209
Atom meta @ 112025119 of size: 90, ends @ 112025209
Atom hdlr @ 112025131 of size: 33, ends @ 112025164
Atom ilst @ 112025164 of size: 45, ends @ 112025209
Atom too @ 112025172 of size: 37, ends @ 112025209
Atom data @ 112025180 of size: 29, ends @ 112025209
作者: kkx55893 (kkx)   2016-10-06 20:12:00
Youtube如何处理分段送影片档案broswer端的,broswer的blob如何持续append新的段落呢
作者: b510336 (风的细语)   2016-10-06 23:30:00
大大如此用心的回文小的实在是内牛满面了QAQ
作者: jjwei ( <囧> )   2016-10-07 09:10:00
推一个
作者: Neo1978 (Neo1978)   2016-10-08 17:59:00
如果是用ffmpeg转档,可以加faststart把moov搬到前面或者用qt-faststart
作者: kkc (卡西)   2016-10-10 22:47:00
推一个!!!

Links booklink

Contact Us: admin [ a t ] ucptt.com