HTML5 – How to stream large .mp4 files?

by
  1. Ensure that the moov (metadata) is before the mdat (audio/video data). This is also called “fast start” or “web optimized”. For example, Handbrake has a “Web Optimized” checkbox, and ffmpeg and avconv have the output option -movflags faststart.
  2. Ensure that your web server is reporting the correct Content-Type (video/mp4).
  3. Ensure that your web server is configured to serve byte range requests.
  4. Ensure that your web server is not applying gzip or deflate compression on top of the compression in the mp4 file.

You can check the headers being sent by your web server using curl -I http://yoursite/video.mp4 or using the developer tools in your browser (Chrome, Firefox) (reload the page if it is cached). The HTTP Response Header should include Content-Type: video/mp4 and Accept-Ranges: bytes, and no Content-Encoding:.

More Related Contents:

  1. Streaming via RTSP or RTP in HTML5
  2. How to prevent downloading images and video files from my website?
  3. Play local (hard-drive) video file with HTML5 video tag?
  4. Is there a way to make HTML5 video fullscreen?
  5. Best approach to real time http streaming to HTML5 video client [closed]
  6. Another: Force Chrome to fully buffer mp4 video
  7. How to stream audio/video files such as MP3, MP4, AVI, etc using a Servlet
  8. Force HTML5 youtube video
  9. Embed YouTube video – Refused to display in a frame because it set ‘X-Frame-Options’ to ‘SAMEORIGIN’ [duplicate]
  10. Playing m3u8 Files with HTML Video Tag
  11. HTML5 Video // Completely Hide Controls
  12. Html Video player plays sound but not video
  13. HTML5 Video / End of a Video Poster
  14. Safari 9.0 can not play mp4 video on the storage server
  15. plays in other browsers, but not Safari
  16. Large file upload though html form (more than 2 GB)
  17. Play infinitely looping video on-load in HTML5
  18. HTML5 Video not working in IE 11
  19. preparing mp4 file for html 5
  20. html5 video tag codecs attribute
  21. Streaming a video from Google Drive using HTML5 video tag
  22. Force iframe YouTube video to center fit and full cover the screen in the background using HTML5 CSS3
  23. Safari – Videos load far too slowly
  24. Send custom HTTP request header with HTML5 audio tag
  25. Media Source Api not working for a custom webm file (Chrome Version 23.0.1271.97 m)
  26. Is any way that is safe to display videos in a browser
  27. html5 video safari downloads full before playing
  28. YouTube URL in Video Tag
  29. Image placeholder fallback for HTML5 Video
  30. Add padding at the beginning and end of each line of text

Leave a Comment