Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: basic drm support #54

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

sck-v
Copy link

@sck-v sck-v commented Aug 19, 2024

Short description

Basic DRM support

Technical description

This PR adds basic DRM support to video-player.

There are two ways to implement DRM:

  1. Using HLS.js built-in support, which provides multiple key systems support
  2. Using native html5 FairPlay support for apple webkit browsers

This should be enough for now, as hls is supported natively on Apple / Safari only. All others are using hls.js fallback. No additional formats are supported now

Basic DRM playback documentation could be find here

let spc_string = btoa(String.fromCharCode(...new Uint8Array(event.message)));
let licenseResponse = await fetch(licenseServerUrl, {
method: 'POST',
headers: new Headers({'Content-type': 'application/json', 'X-AxDRM-Message': 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ2ZXJzaW9uIjoxLCJjb21fa2V5X2lkIjoiNjllNTQwODgtZTllMC00NTMwLThjMWEtMWViNmRjZDBkMTRlIiwibWVzc2FnZSI6eyJ2ZXJzaW9uIjoyLCJ0eXBlIjoiZW50aXRsZW1lbnRfbWVzc2FnZSIsImxpY2Vuc2UiOnsiYWxsb3dfcGVyc2lzdGVuY2UiOnRydWV9LCJjb250ZW50X2tleXNfc291cmNlIjp7ImlubGluZSI6W3siaWQiOiIyMTFhYzFkYy1jOGEyLTQ1NzUtYmFmNy1mYTRiYTU2YzM4YWMiLCJ1c2FnZV9wb2xpY3kiOiJUaGVPbmVQb2xpY3kifV19LCJjb250ZW50X2tleV91c2FnZV9wb2xpY2llcyI6W3sibmFtZSI6IlRoZU9uZVBvbGljeSIsInBsYXlyZWFkeSI6eyJwbGF5X2VuYWJsZXJzIjpbIjc4NjYyN0Q4LUMyQTYtNDRCRS04Rjg4LTA4QUUyNTVCMDFBNyJdfX1dfX0.D9FM9sbTFxBmcCOC8yMHrEtTwm0zy6ejZUCrlJbHz_U'}),
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's a test token for public test stream, so no need to scrub it

@Bitaru
Copy link
Collaborator

Bitaru commented Aug 19, 2024

🎉 This issue has been resolved in version 1.2.0-next.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

@Bitaru
Copy link
Collaborator

Bitaru commented Aug 23, 2024

🎉 This issue has been resolved in version 1.2.0-next.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

@sck-v sck-v requested a review from Bitaru August 27, 2024 09:13
Copy link
Collaborator

@Bitaru Bitaru left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Checked the code
✅ Fixed issue when the native player gets ready before events attachment

@sck-v sck-v marked this pull request as ready for review September 18, 2024 10:47
@sck-v
Copy link
Author

sck-v commented Oct 2, 2024

@uhodimOgorodami basically, this is a part of https://github.com/Uscreen-video/uscreen_2/pull/15714. So once we are fine with those changes, this request could also be approved. Thanks 🙏

@savroff
Copy link

savroff commented Oct 2, 2024

@uhodimOgorodami basically, this is a part of Uscreen-video/uscreen_2#15714. So once we are fine with those changes, this request could also be approved. Thanks 🙏

@timaramazanov how we releasing new player versions in general?

@timaramazanov
Copy link
Collaborator

@savroff by pushing commits into the main branch, GH actions will build new version and publish it in NPM, we will need to update player version in uscreen repo after

@timaramazanov
Copy link
Collaborator

@savroff and to create new -next version - we need to push commits into the next branch.

Copy link
Collaborator

@timaramazanov timaramazanov left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

left couple code style comments

@@ -0,0 +1,57 @@
import { DRMSystemConfiguration } from "../types";

export const initFairPlayDRM = async (element: HTMLElement, fairPlayOptions: DRMSystemConfiguration) => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we can be more precise here and say that we expect HTMLVideoElement, mb rename var element to videoElement ?

drmSystems: this.drmOptions
? {
"com.apple.fps": {
licenseUrl: this.drmOptions[KeySystems.fps].licenseUrl,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

DRMOptions type declares that all keys are optional, should we double check here if all option that we are going to use are actually exists ? Or if we suppose that client should pass all keys to options - maybe we should reflect it in the type ?

videoCapabilities: [{ contentType: 'application/vnd.apple.mpegurl' }],
}]);

console.log(access);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do we need this log?
If so - let's use debug lib, here an example: https://github.com/Uscreen-video/video-player/blob/main/src/components/video-container/subtitles.ts#L7

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants