1

In HTML <video> object, I cannot play a video recorded by the video.js-record library. I checked the Blob returned in the player.recordedData variable and wanted to assign it to the object like mentioned in the example from the Documentation:

recordedVideo.src = createObjURL(this.player.recordedData);

It fails with an error on this specific line:

Unhandled Promise Rejection: TypeError: Type error

--

(I am already checking the use of URL vs webkitURL using this function:

function createObjURL ( file ) {
    if ( window.webkitURL ) {
        return window.webkitURL.createObjectURL( file );
    } else if ( window.URL && window.URL.createObjectURL ) {
        return window.URL.createObjectURL( file );
    } else {
        return null;
    }
}

and it seems to use the right version.)

nopassport1
  • 1,821
  • 1
  • 25
  • 53
gertschi
  • 13
  • 4

1 Answers1

1

Looking at the document of video.js-record, player.recordedData is not a Blob (what you would need to pass to createObjectUrl) but an array of blob segments - this would match the TypeError.

The following change should help:

function createObjURL ( blobPieces ) {
    var blob = new Blob(blobPieces, { type: 'video/webm' });
    if ( window.webkitURL ) {
        return window.webkitURL.createObjectURL( blob );
    } else if ( window.URL && window.URL.createObjectURL ) {
        return window.URL.createObjectURL( blob );
    } else {
        return null;
    }
}
gertschi
  • 13
  • 4
dontcallmedom
  • 2,420
  • 14
  • 12
  • Unfortunately does not help. `player.recordedData` already returns a Blob. This would be its console.log: `Blob { lastModified: 1580220847318, lastModifiedDate: Date Tue Jan 28 2020 15:14:07 GMT+0100, name: "1580220847318.webm", size: 362155, type: "video/webm" }` – gertschi Jan 28 '20 at 14:15