Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create blob of a video file

I would like to create a Blob of a local video file file:///home/user/NodeJS/Projects/project1/routes/../videosTrans/Node.js tutorial for beginners - an introduction to Node.js with Express2.js.mp4

I could not understand the exact format of the Blob. I wish to create it to give it as input to the function createObjectURL(). The following does not work:

 var URL = this.window.URL || this.window.webkitURL;
       var file = new Blob(["file:///home/sanika/NodeJS/Projects/project1/routes/../videosTrans/Node.js tutorial for beginners - an introduction to Node.js with Express2.js.mp4"], "type" : "video\/mp4");
       var value = URL.createObjectURL(file);
like image 879
MindBrain Avatar asked Oct 23 '14 17:10

MindBrain


People also ask

What is Blob in video?

Blobs are used to store a specific type of information, such as images and multimedia files. They also typically require a lot more space than other types of data. Blob URLs contain pseudo protocols that can create a temporary URL to audio and video files.

How do you make a Blob out of an object?

To construct a Blob from other non-blob objects and data, use the Blob() constructor. To create a blob that contains a subset of another blob's data, use the slice() method. To obtain a Blob object for a file on the user's file system, see the File documentation.

How do I get Blob URL?

Assuming you're uploading the blobs into blob storage using . Net storage client library by creating an instance of CloudBlockBlob, you can get the URL of the blob by reading Uriproperty of the blob.

How do you play Blob videos?

From the menu bar, click the "Windows" tab > then “Activity”. Step 2. Head on to a website where the blob video is and play the video. Step 3.


2 Answers

Please use the second parameter of blob as object. so your code should be :

var URL = this.window.URL || this.window.webkitURL;
var file = new Blob(
    ["file:///home/sanika/NodeJS/Projects/project1/routes/../videosTrans/Node.js tutorial for beginners - an introduction to Node.js with Express2.js.mp4"],
    {"type" : "video\/mp4"});
var value = URL.createObjectURL(file);
like image 184
Muhammad Babar Avatar answered Oct 11 '22 12:10

Muhammad Babar


you can get that by the following piece of code. JSFiddle demo link also given for testing

HTML Code

<form>
    <video></video>
    <br/>
    <input type="file" name="file" id="fileItem" onchange="onChange()" >
    <input type="submit" value="Play">
</form>

JS Code

    var URL = window.URL || window.webkitURL;
    var video = document.getElementsByTagName('video')[0];
    function onChange() {
        var fileItem = document.getElementById('fileItem');
        var files = fileItem.files;
        var file = files[0];
        var urlBlob = URL.createObjectURL(file);
        video.src = urlBlob;
        video.load();
        video.onloadeddata = function() {
            video.play();
        }
    }

Test It here

https://jsfiddle.net/9ad3nm2o/2/

like image 1
Muhammad Tahir Avatar answered Oct 11 '22 11:10

Muhammad Tahir