How to play mp4 video in html video tag in which the video is uploaded via multer

Question

I have to play video in my website. The video is uploaded via multer with node.js and in express framework.The file is inserting to the database and the specified folder(file name like 1b47c24b20cc2465fbcb395fd1a9dfb4). I am uploading image also and its showing properly But video is not playing.

Here is my html code

<div class="form-group">
<label>Upload image</label>
<input type="file" name="file" id="file" ng-model="testimonial.file" ngf-select ngf-max-size="25MB" required">
<img ng-src="/images/{{testimonial.image.filename}}" width="49" height="49" ng-model="testimonial.file" /><br/>
<label>Upload video</label>
<input type="file" name="video" id="video" ng-model="testimonial.video" ngf-select ngf-max-size="25MB" required">
<video width="320" height="240" controls>
<source src="/images/{{testimonial.video.filename}}" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</div>  

Please help me to find out the solution. and what is .ogg file how can i generate while uploading my video?

Answer 1

while uploading via multer please include extension.

var storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'public/images')
  },
 filename: function (req, file, cb) {
    let extArray = file.mimetype.split("/");
    let extension = extArray[extArray.length - 1];
    cb(null, file.fieldname + '-' + Date.now()+ '.' +extension)
  }
})

and while displaying via angular use the below code

<video controls="controls" ng-src="{{getVideoUrl(data.video[0].filename)}}" width="250" height="180"></video>

Angular under controller

 $scope.getVideoUrl=function(videopath)
        {
            return $sce.trustAsResourceUrl("/images/"+videopath);
        };

don't forget to include $sce

thank you