vhs-json MEDIA_ERR_DECODE on encrypted segments

[Mordo95]

Description

When loading a VOD playlist as URL, everything works fine. But since we preload our playlists, using vhs-json would be the more appropiate way. Sadly, when doing this using the snippet from the readme, it will throw a MEDIA_ERR_DECODE error.

Appropiate code;

import {Parser} from 'm3u8-parser';

const VIDEO_M3U8 = `#EXTM3U
#EXT-X-VERSION:3
#EXT-X-TARGETDURATION:12
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-KEY:METHOD=AES-128,URI="http://127.0.0.1:8000/video/key?token=abc",IV=0xecd0d06eaf884d8226c33928e87efa33
#EXTINF:10.440000,
http://127.0.0.1:8000/video/fileSequence0.ts
#EXT-X-ENDLIST
`;

const parser = new Parser();
parser.push(VIDEO_M3U8);
parser.end();

// ... in ready callback
this.player.src({
    src: `data:application/vnd.videojs.vhs+json,${JSON.stringify(parser.manifest)}`,
    type: 'application/vnd.videojs.vhs+json'
});

Sources

Any AES-128 encrypted video that works fine using a direct url.

Steps to reproduce

Explain in detail the exact steps necessary to reproduce the issue.

1. Encrypt a MP4 to a VOD with AES-128
2. include playlist as string
3. Parse playlist using m3u8-parser
4. Copy the example from README.md into player ready function

Results

Expected

Expected to play normally.

Error output

VIDEOJS: ERROR: (CODE:3 MEDIA_ERR_DECODE) Playback cannot continue. No available working or supported playlists. Object { code: 3, message: "Playback cannot continue. No available working or supported playlists." } video.es.js:228:47 LogByTypeFactory2 video.es.js:228 error video.es.js:416 error video.es.js:26181 src video.es.js:54564 dispatcher video.es.js:2311 trigger video.es.js:2447 trigger video.es.js:2850 blacklistCurrentPlaylist video.es.js:52252 getCodecsOrExclude_ video.es.js:52704 tryToCreateSourceBuffers_ video.es.js:52807 updateCodecs2 video.es.js:51804 dispatcher video.es.js:2311 trigger video.es.js:2447 trigger video.es.js:2850 handleTrackInfo_ video.es.js:45742 handleSegmentBytes2 video.es.js:42405 decryptSegment2 video.es.js:42509 decryptionHandler2 video.es.js:42441

Additional Information

videojs-http-streaming 2.15.0 video.js 7.20.3 m3u8-parser 6.0.0

Browsers

Chrome Firefox Both latest version.

[video-archivist-bot]

Hey! We've detected some video files in a comment on this issue. If you'd like to permanently archive these videos and tie them to this project, a maintainer of the project can reply to this issue with the following commands:

• for http://127.0.0.1:8000/video/fileSequence0.ts: say @video-archivist-bot save JA14Rw

[welcome[bot]]

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

[Mordo95]

Doing some debugging, I noticed that the conversion step to json then from json changes the segment[x].key.iv type from UInt32Array to Object, causing the check isArrayBufferView inside createTransferableMessage to fail.

My current workaround is to pre-transform the IVs to the format that the decryption webworker requires as per the following;

const parser = new Parser();
parser.push(VIDEO_M3U8);
parser.end();
let manifest = parser.manifest;
manifest.segments = manifest.segments.map((segment) => {
    segment.key = {...segment.key}; // deref
    let bytes = Array.prototype.slice.call(segment.key.iv);
    segment.key.iv = {
        bytes,
        byteOffset: segment.key.iv.byteOffset,
        byteLength: segment.key.iv.byteLength
    };
    return segment;
});
this.player.src({
    src: `data:application/vnd.videojs.vhs+json,${JSON.stringify(manifest)}`,
    type: 'application/vnd.videojs.vhs+json',
});

and then the video plays normally. Could anyone make a fix for this?

[misteroneill]

Thanks for the detailed report! This seems like a pretty low priority bug, honestly, since it sounds like it works with a normal playlist.

A pull request would be a big help. Otherwise, I'm not sure when someone will be able to get to this.