Getting keySystemNoAccess error for FairPlay DRM

[jordi-ander]

I'm trying to configure my player to work with FairPlay drm'd content. I keep getting a keySystemNoAccess error.

I'm working with Accurate Player hls player ^8.2.0 in an Angular application. Widevine is working for Google Chrome and Firefox with no issue but the same content won't play in Safari. (Testing with Safari 16.6).

I added the licenseXhrSetup and the licenseResponseCallback config options to the hlsconfig but so far I haven't gotten to a solution. There were also some functions in the docs that didn't exist in his.js when I tried adding them to my project (ex base64Encode and I tried to find some work arounds.

`settings: Partial = {

  hlsConfig: {
    emeEnabled: true,
    licenseXhrSetup: this.drmType === 'FAIRPLAY' 
      ? function (xhr, url, keyContext, licenseChallenge) {
        let payload = licenseChallenge;

        // Send cookies with request
        xhr.withCredentials = true;
        // Call open to change the method (default is POST), modify the url, or set request headers
        xhr.open('POST', url, true);
    console.log('xhr set up. key system', keyContext.keySystem);
        // call xhr.setRequestHeader after xhr.open otherwise licenseXhrSetup will throw and be called a second time after HLS.js call xhr.open
        if (keyContext.keySystem === 'com.apple.fps') {
          xhr.setRequestHeader('Content-Type', 'application/json');
          payload = new TextEncoder().encode(JSON.stringify({
            keyData: btoa(String.fromCharCode(...new Uint8Array(keyContext.decryptdata?.keyId || []))),
            licenseChallenge: btoa(String.fromCharCode(...new Uint8Array(licenseChallenge))),
          }));
        }
        else {
          xhr.setRequestHeader('Content-Type', 'application/octet-stream');
        }
        // Return the desired payload or a Promise<Uint8Array>.
        // Not returning a value, or returning `undefined` or` Promise<void>` will result in the `licenseChallenge` being used.
        // return fetchDRMToken(this.authData).then((result) => {
        //   xhr.setRequestHeader('token', token);
          return payload;
        // });
      } : undefined,
    licenseResponseCallback:  this.drmType === 'FAIRPLAY' 
      ? function(xhr, url, keyContext) {
        const keySystem = keyContext.keySystem;
        console.log('callback keysystem', keySystem);
        const response = xhr.response;
        if (keyContext.keySystem === 'com.apple.fps') {
          try {
            const responseObject = JSON.parse (
              new TextDecoder().decode(response).trim()
            );
            const keyResponse = responseObject['fairplay-streaming-response']['streaming-keys'][0];
            return atob(keyResponse.ckc); // base64Decode
          } catch (error) {
            console.error(error)
          }
        }
        return response;
      } : undefined,
    drmSystems: {
      'com.widevine.alpha': { // google
        licenseUrl: this.DRMKeySystems?.WIDEVINE.url || '' // this.drmLicenseUrl || '' 
      },
      'com.apple.fps': { // fairplay - apple
        licenseUrl: this.DRMKeySystems?.FAIRPLAY.url || '',
        serverCertificateUrl: this.DRMKeySystems?.FAIRPLAY.certificateURL || ''
      }
    },
    drmSystemOptions : {
      audioRobustness: 'SW_SECURE_CRYPTO',
      videoRobustness: 'SW_SECURE_CRYPTO'
    }
  }`

[robwalch]

I keep getting a keySystemNoAccess error.

keySystemNoAccess errors mean that the browser is not granting access to the key-system as requested. This could be because the drmSystemOptions or something in the media configuration are not supported (see Requesting encrypted media "com.apple.fps" key-system access with config: ... log lines).

I added the licenseXhrSetup and the licenseResponseCallback config options to the hlsconfig but so far I haven't gotten to a solution.

How you format the license request payload and transform the response depend on your license server. Contact the DRM provider and ask how to setup HLS.js, if they don't know, they should be filing an issue with the project and working with us to establish examples that you can get from their site.

There were also some functions in the docs that didn't exist in his.js when I tried adding them to my project (ex base64Encode and I tried to find some work arounds.

You need to provide your own functions for converting data formats. Those requirements are not on HLS.js but on the license server implementation for not providing a response in the format that EME expects.

Here's an example of what the setup looks like for AWS:

{
  emeEnabled: true,
  drmSystems: {
    'com.apple.fps': {
      licenseUrl: 'https://fairplay-license',
      serverCertificateUrl:
        'https://fairplay-cert',
    },
    'com.widevine.alpha': {
      licenseUrl:
        'https://widevine-license',
    },
    'com.microsoft.playready': {
      licenseUrl:
        'https://playready-license',
    },
  },
  licenseXhrSetup(xhr, url, keyContext, licenseChallenge) {
    const keySystem = keyContext.keySystem;
    const uri = keyContext.decryptdata?.uri;
    const keyId = keyContext.decryptdata?.keyId;
    if (keySystem === 'com.apple.fps') {
      xhr.responseType = 'text';
    }
    xhr.open('POST', url, true);
    xhr.setRequestHeader(
      'x-dt-custom-data',
      'GET THIS FROM AWS',
    );
    return licenseChallenge;
  },
  licenseResponseCallback(xhr, url, keyContext) {
    const keySystem = keyContext.keySystem;
    const response = xhr.response;
    if (keySystem === 'com.apple.fps') {
      const base64Decode = (base64encodedStr) =>
        Uint8Array.from(atob(base64encodedStr), (c) => c.charCodeAt(0));
      const data = base64Decode(xhr.response);
      return data.buffer;
    }
    return response;
  },
}

Some platforms might require a generateRequest callback for transforming init data into a valid pssh box, others require no license request or response callbacks at all (EZDRM). Who is your DRM provider?

[jordi-ander]

I see. The DRM provider I'm using is irdeto.

[jordi-ander]

I updated my config to the following per what I believe is required for irdeto for FairPlay

``
hlsConfig: {

    emeEnabled: true,
    licenseXhrSetup: this.drmType === 'FAIRPLAY' 
      ? function (xhr, url, keyContext, licenseChallenge) {
        xhr.responseType = 'blob';
        xhr.setRequestHeader('Content-Type', 'application/octet-stream');
        
        return new Promise((resolve, reject) => {
          const reader = new FileReader();
          reader.addEventListener('loadend', () => {
            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
            // @ts-ignore
            const array = new Uint8Array(reader.result);
            resolve(array);
          });
          reader.addEventListener('error', () => {
            reject(reader.error);
          });

          const responseObject = JSON.parse (
            new TextDecoder().decode(xhr.response).trim()
          );
          console.log('callback responseObject', responseObject);
          
          const keyResponse = responseObject['fairplay-streaming-response']['streaming-keys'][0];

          reader.readAsArrayBuffer(keyResponse.ckc);
        });
      } : undefined,
    drmSystems: {
      'com.widevine.alpha': { // google
        licenseUrl: this.DRMKeySystems?.WIDEVINE.url || '' // this.drmLicenseUrl || '' 
      },
      // 'com.microsoft.playready': { // playready - edge
      //   licenseUrl: this.DRMKeySystems?.PLAYREADY.url || ''
      // },
      // @ts-ignore 
      'com.apple.fps': { // tslint:disable-line
        licenseUrl: this.DRMKeySystems?.FAIRPLAY.url || '',
        serverCertificateUrl: this.DRMKeySystems?.FAIRPLAY.certificateURL || ''
      }
    },
    drmSystemOptions : {
      audioRobustness: 'SW_SECURE_CRYPTO',
      videoRobustness: 'SW_SECURE_CRYPTO'
    },
    requestMediaKeySystemAccessFunc: (keySystem, supportedConfigurations) => {
      console.log('request media key', keySystem, 'supportedConfiguerations', supportedConfigurations);
      
      if (keySystem === 'com.apple.fps') {
        // @ts-ignore 
        keySystem = 'com.apple.fps.1_0';
      }
      return navigator.requestMediaKeySystemAccess(keySystem, supportedConfigurations);
    }
  }

``

Unfortunately still getting key access error.

[Error] Hls.js encountered a fatal error – {type: "keySystemError", details: "keySystemNoAccess", error: NotSupportedError: The operation is not supported., …} {type: "keySystemError", details: "keySystemNoAccess", error: NotSupportedError: The operation is not supported., fatal: true, err: NotSupportedError: The operation is not supported.}Object handleEvent (vendor.js:26764) (anonymous function) (vendor.js:26790) emit (vendor.js:75164) trigger (vendor.js:86218) handleFragLoadError (vendor.js:69956) onInvoke (vendor.js:124945) run (polyfills.js:7994) (anonymous function) (polyfills.js:9070) onInvokeTask (vendor.js:124622) onInvokeTask (vendor.js:124934) runTask (polyfills.js:8040) drainMicroTaskQueue (polyfills.js:8407)

[robwalch]

Did you try without the audioRobustness/videoRobustness and without overridding requestMediaKeySystemAccessFunc?

HLS.js (and MSE/EME in general) does not support "com.apple.fps.1_0". It's stated in the README:

Not Supported
FairPlay Streaming legacy keys (For com.apple.fps.1_0 use native Safari playback)

[robwalch]

From what I see in other player docs, Irdeto should be returning an arraybuffer that doesn't require any transformation. So, start by dropping everything but drmSystems and make sure you're not hitting an old Fairplay Streaming endpoint.

[jordi-ander]

I was able to find a solution to my problem.

First, I removed the robustness as Rob suggested. According to Shaka Player DRM configuration, Apple's Documentation states the robustness should be an empty string.

Secondly, the Irdeto service providing me with the DRM key was expecting com.apple.fps.1_0 while HLS was expecting com.apple.fps. To work around this, I added a mapping to the requestMediaKeySystemAccessFunc

requestMediaKeySystemAccessFunc: (keySystem, supportedConfigurations) => {
  if (keySystem === 'com.apple.fps') {
      // @ts-ignore
      keySystem = 'com.apple.fps.1_0';
  }
  return navigator.requestMediaKeySystemAccess(keySystem, supportedConfigurations);
}

I also updating the license xhr setup to match what my service was expecting and changed the keySystem in the licenseResponseCallback to com.apple.fps.1_0 and returned the xhr response arrayBuffer.

In the end, my hls configuration looked like this

let settings: Partial<HlsPlayerSettings> = {
      hlsConfig: {
        emeEnabled: true,
        licenseXhrSetup: this.drmType === 'FAIRPLAY' 
          ? function (xhr, url, keyContext, licenseChallenge) {
            // @ts-ignore 
            const keyId = keyContext.decryptdata?.uri.match(/keyId=([^&]+)/i)[1] || '';
            // @ts-ignore 
            const contentId = keyContext.decryptdata?.uri.match(/contentId=([^&]+)/i)[1] || '';
            const licenseUrl = `${url}&contentId=${contentId}&keyId=${keyId}`

            xhr.open('POST', licenseUrl, true)
            xhr.responseType = 'blob';
            xhr.setRequestHeader('Content-Type', 'application/octet-stream');

            return licenseChallenge;
            
          } : undefined,
          licenseResponseCallback:  this.drmType === 'FAIRPLAY' 
          ? function(xhr, url, keyContext) {
            // @ts-ignore 
            keyContext.keySystem = 'com.apple.fps.1_0';
            return xhr.response.arrayBuffer();
          } : undefined,
        drmSystems: {
          'com.widevine.alpha': { 
            licenseUrl: this.drmKeySystems?.WIDEVINE.url || ''
          },
          'com.microsoft.playready': {
            licenseUrl: this.drmKeySystems?.PLAYREADY.url || ''
          },
          'com.apple.fps': {
            licenseUrl: this.drmKeySystems?.FAIRPLAY.url || '',
            serverCertificateUrl: this.drmKeySystems?.FAIRPLAY.certificateURL || ''
          }
        },
        requestMediaKeySystemAccessFunc: (keySystem, supportedConfigurations) => {
          
          if (keySystem === 'com.apple.fps') {
            // @ts-ignore 
            keySystem = 'com.apple.fps.1_0';
          }
          return navigator.requestMediaKeySystemAccess(keySystem, supportedConfigurations);
        }
      }
    }

With this config, I was able to get Fairplay and Widevine working.
Thanks for your help Rob!