Search code examples
html5-videovideogular

Html5, chuncked video streaming

My html-video calls multiple separate request for chunks. seems not like single stream.

When I see that in debugging tools,

enter image description here

As you see, there are 3 different call.

This is the request header,

Accept:*/*
Accept-Encoding:identity;q=1, *;q=0
Accept-Language:ja-JP,en-US;q=0.8
Connection:keep-alive
Cookie:stg_domain_token=oNijQNByftcYnsLGzFZxRyCesLR-GdWKi6a-uKSJJ9060Yk8pwCiUlcHChyf
Host:stg.myhost.com
Range:bytes=32768-
User-Agent:Mozilla/5.0 (Linux; Android 6.0.1; SC-05G Build/MMB29K; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/54.0.2840.68 Mobile Safari/537.36
X-DevTools-Emulate-Network-Conditions-Client-Id:62626f5b-82c9-48b9-97f5-a7a983e1c3bc

and here is the response header,

accept-ranges:bytes
Connection:keep-alive
Content-Disposition:filename=49976265106__9BB3FA25-04E4-4AF5-903C-9B12CF622567.MOV
Content-Length:324882
content-range:bytes 32768-357649/357650
Content-Type:video/quicktime
Date:Fri, 04 Nov 2016 06:15:06 GMT
Server:Apache
X-Powered-By:PHP/5.6.17

anyone know what I am missing?

Solution

  • Browser won't download entire video or audio file at a time. It downloads them in chunks and plays them one after another.

    For your understanding, I'm explaining the headers here.

    Request Header

    Accept:*/* : Browser will accept any MIME-Types as response.

    Range:bytes=32768- : Browser already has the video part, till byte 32767 but requires file from byte 32768.

    Response Header

    status : 206 : It means the served content is partial (not complete file)

    accept-ranges:bytes : Server accepts byte ranges only (which is universal)

    Content-Length:324882 : Total content length from requested byte.

    content-range:bytes 32768-357649/357650: it is in this format start byte - last byte / total length (from 0 byte to end)

    Content-Type:video/quicktime : Type of content