How to play HTML5 Video progressively from mysql database without completely downloading it

Active3 hr before
Viewed126 times

4 Answers


Meta Stack Overflow , Stack Overflow Public questions & answers , Stack Overflow help chat ,Am trying to play a .MP4 file stored in a MySQL DB using html5 video. Am able to get it to play, but the problem is it will first download everything from the database before it starts playing. When test online it takes almost forever before the video starts playing. This doesn't behave the same when you are playing the video as a file from a filesystem. Playing from a file plays progressively as its downloading. Is there anyway i can get its to play as is a filesysem.

Below is the PHP code that does the retrieval from the database with the appropriate headers.

        $size = $meta_object - > video_file_size; // File size
        $length = $size; // Content length
        $start = 0; // Start byte
        $end = $size - 1; // End byte

        header('Content-type: video/mp4');
        header("Accept-Ranges: bytes");
        if (isset($_SERVER['HTTP_RANGE'])) {

           $c_start = $start;
           $c_end = $end;

           list(, $range) = explode('=', $_SERVER['HTTP_RANGE'], 2);
           if (strpos($range, ',') !== false) {
              header('HTTP/1.1 416 Requested Range Not Satisfiable');
              header("Content-Range: bytes $start-$end/$size");
           if ($range == '-') {
              $c_start = $size - substr($range, 1);
           } else {
              $range = explode('-', $range);
              $c_start = $range[0];
              $c_end = (isset($range[1]) && is_numeric($range[1])) ? $range[1] : $size;
           $c_end = ($c_end > $end) ? $end : $c_end;
           if ($c_start > $c_end || $c_start > $size - 1 || $c_end >= $size) {
              header('HTTP/1.1 416 Requested Range Not Satisfiable');
              header("Content-Range: bytes $start-$end/$size");
           $start = $c_start;
           $end = $c_end;
           $length = $end - $start + 1;
           header('HTTP/1.1 206 Partial Content');
        header("Content-Transfer-Encoding: binary");
        header("Content-Range: bytes $start-$end/$size");

        while ($row = mysql_fetch_array($query)) {
           echo $video_file_data;
        header("Content-Length: ".$length);
load more v

Like all other HTML elements, this element supports the global attributes.,The <video> HTML element embeds a media player which supports video playback into the document. You can use <video> for audio content as well, but the <audio> element may provide a more appropriate user experience.,<video>: The Video Embed element,To test the fallback content on browsers that support the element, you can replace <video> with a non-existing element like <notavideo>.

<video controls>
   <source src="myVideo.webm" type="video/webm">
   <source src="myVideo.mp4" type="video/mp4">
   <p>Your browser doesn't support HTML5 video. Here is
      a <a href="myVideo.mp4">link to the video</a> instead.</p>
load more v

The <source> element allows you to specify alternative video files which the browser may choose from. The browser will use the first recognized format.,If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:,It is a good idea to always include width and height attributes. If height and width are not set, the page might flicker while the video loads.,The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element.

The HTML <video> element is used to show a video on a web page.

load more v

Initially, Ogg Theora was the recommended standard video format in HTML5, because it was not affected by any known patents. But on 10 December 2007, the HTML5 specification was updated,[8] replacing the reference to concrete formats: ,HTML5 audio canvas video,^ "The video element". HTML5: A vocabulary and associated APIs for HTML and XHTML. World Wide Web Consortium. 24 June 2010. Archived from the original on 13 August 2010. Retrieved 27 September 2010. A video element is used for playing videos or movies. ,In the announcement, Cisco cited its desire of furthering the use of the WebRTC project as the reason, since WebRTC's video chat feature will benefit from having a video format supported in all browsers.[37] The H.264 module will be available on "all popular or feasibly supportable platforms, which can be loaded into any application".[38]

<video src="movie.webm" poster="movie.jpg" controls>
   This is fallback content to display for user agents that do not support the video tag.
load more v

Other "html5-without" queries related to "How to play HTML5 Video progressively from mysql database without completely downloading it"