Is there a way to play mpeg videos in HTML5?

Question

My pc based web application uses HTML5, and I want to import mpeg files to play in my browser which have been saved that way by other application. Is there a way to play these video files with HTML5?

EDIT:

The application tries to play the mpeg files from the local hard drive rather than from the server. So, user has an ability to choose the mpeg files to play the selected mpeg files.

HTML:

<input id="t20provideoinput" type="file" multiple accept="video/*"/>
<video id="t20provideo" controls controls>

Javascript:

(function localFileVideoPlayerInit(win) {
    var URL = win.URL || win.webkitURL;
    var sources = [];
    var j = 1;
    var videoNode = document.querySelector('video');
    var videoNode1 = document.querySelector('object');
    var groupElement = document.getElementsByClassName('metric')[0];
    console.log('this is group element ' + groupElement);

    var playSelectedFile = function playSelectedFileInit(event) {
            for(var i=0; i<this.files.length; i++){
                var file = this.files[i];

                var type = file.type;


                var fileURL = URL.createObjectURL(file);

                sources.push(fileURL);
            }

            groupElement.addEventListener('click', function(){
                videoNode.src = sources[0];
            });
        };

    var inputNode = document.getElementById('t20provideoinput');

    videoNode.addEventListener('ended', function(){
       videoNode.src = sources[j++];
       videoNode.load();
       videoNode.play();
    }, false);

    if (!URL) {
        displayMessage('Your browser is not ' + 
           '<a href="http://caniuse.com/bloburls">supported</a>!', true);

        return;
    }                

    console.log(inputNode);
    if (inputNode != null) { 
        inputNode.addEventListener('change', playSelectedFile, false);
    }

}(window)); 

modified from http://jsfiddle.net/dsbonev/cCCZ2/embedded/result,js,html,css/presentation/

I tried few things like adding plugins to the browser, used Mediaelement.js, used object tag to see if those selected mpeg files can be played. But, the attempts were unsuccessful.

Below is the code snippet where I used the object tag in html5

<object type="video/mpeg" data="test.mpeg" width="200" height="40">
  <param name="src" value="test.mpeg" />
  <param name="autoplay" value="false" />
  <param name="autoStart" value="0" />
</object>

Any suggestion is highly appreciated.

Answer 1

For MPEG1, you can try jsmpeg. JSMpeg is lower latency.

And you can check https://jsmpeg.com/ for pros and cons