Digital Rights Management (DRM)

Note

ฟีเจอร์นี้ของ ByteArk Player รองรับเฉพาะผู้ใช้ ByteArk Video Cloud for Business หากท่านต้องการใช้งานกรุณาติดต่อ sales@byteark.com

ByteArk Player ได้รองรับการทำงานของ DRM 2 ระบบคือ Google Widevine (opens new window) และ Apple FairPlay Streaming (FPS) (opens new window) ทำให้สามารถรองรับการใช้งานบนอุปกรณ์ส่วนใหญ่ในตลาดขณะนี้ได้ และ DRM ทั้งสองระบบรองรับการทำงานบน Web Browser ต่างๆ ที่ได้แสดงในตารางข้างล่างนี้

รองรับการทำงานของ DRM บน Web Browser

DRM	Browser (OS)
Apple FairPlay Streaming (FPS) (opens new window)	Safari 14+ on macOS 10.11+ (El Capitan)
	Safari iOS/iPadOS 12+
Google Widevine (opens new window)	Google Chrome 62+ บน Desktop
	Google Chrome 62+ บน Android
	Firefox 52+ (Windows และ MacOS)

Note

หากต้องการข้อมูลเพิ่มเติม หรือ เปิดใช้งาน DRM สามารถติดต่อทีมงานได้ทาง support@byteark.com

การเปิดใช้งาน DRM บน ByteArk Player

การเปิดใช้งานการเล่น DRM บน ByteArk Player สามารถทำได้โดยระบุ plugins.bytearkShaka ใน options เมื่อทำการสร้าง video player และ ตั้งค่า drm field ใน source object สำหรับ Widevine และ FairPlay ตามตารางด้านล่าง

หมายเหตุ: การใช้งาน DRM ต้องใช้งานผ่าน HTTPS เท่านั้น

ตัวอย่างการตั้งค่า plugin

// Init ByteArk Player
var player = bytearkPlayer('video-player', {
  // player config
  sources: [
    // source object
  ],
  plugins: {
    bytearkShaka: {}
  }
});

Source Object

DRM Source Object ของ Widevine

Name	Type	Required	Description
url	String	Yes	URL ของ Widevine license server
serverCertificateUrl	String	No	URL ของ Widevine service certificate
videoRobustness	String	No	ตั้งระดับความปลอดภัยในการเล่นวิดีโอ สามารถตั้งค่าเป็น: SW_SECURE_CRYPTO, SW_SECURE_DECODE, HW_SECURE_CRYPTO, HW_SECURE_DECODE, HW_SECURE_ALL
audioRobustness	String	No	ตั้งระดับความปลอดภัยในการเล่นออดิโอ สามารถตั้งค่าเป็น: SW_SECURE_CRYPTO, SW_SECURE_DECODE, HW_SECURE_CRYPTO, HW_SECURE_DECODE, HW_SECURE_ALL
licenseRequestHeaders	Array<{name: String; value: String}>	No	ตั้งค่า custom header สำหรับใช้ในการส่ง request ไปยัง license server

หมายเหตุ: การตั้งค่า videoRobustness และ audioRobustness เป็น Hardware (prefix ด้วย HW_) ทำให้การเล่น วิดีโอ/ออดิโอ ต้องใช้ Hardware ในการถอดรหัส (decrypt) ซึ่งอาจจะทำให้ไม่สามารถเล่นวิดีโอได้ในบางอุปกรณ์ ซึ่งขึ้นอยู่กับ policy ของเจ้าของ content

ตัวอย่างการตั้งค่า source object ของ Widevine

{
  src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
  type: 'application/x-mpegURL',
  drm: {
    widevine: {
      url: '<URL_TO_WIDEVINE_LICENSE_SERVER>'
    }
  }
}

ตัวอย่างการตั้งค่า source object ของ Widevine เพื่อส่ง Authorization Header

{
  src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
  type: 'application/x-mpegURL',
  drm: {
    widevine: {
      url: '<URL_TO_WIDEVINE_LICENSE_SERVER>'
      licenseRequestHeaders: [
        {
          name: 'Authorization',
          value: '<YOUR_AUTHORIZATION_HEADER>'
        }
      ]
    }
  }
}

DRM Source Object ของ FairPlay

Name	Type	Required	Description
certificateUrl	String	Yes	URL ของ FairPlay certificate
processSpcUrl	String	Yes	URL ของ FairPlay license server
extractContentId	Function	No	Callback function ที่รับ string initData Uri ที่ได้จาก needkey event, ใช้ function นี้เมื่อต้องการส่ง custom contentId ไปให้ license server
extractKey	Function	No	Callback function ที่รับ response object (opens new window) เป็น parameter, ใช้ function นี้เพื่อแปลง response data เป็น key ในการเล่นวิดีโอ
licenseRequestHeaders	Array<{name: String; value: String}>	No	ตั้งค่า custom header สำหรับใช้ในการส่ง request ไปยัง license server

ตัวอย่างการตั้งค่า source object ของ FairPlay

{
  src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
  type: 'application/x-mpegURL',
  drm: {
    fairplay: {
      certificateUrl: '<URL_TO_CERTIFICATE>',
      processSpcUrl: '<URL_TO_FAIRPLAY_LICENSE_SERVER>'
    }
  }
}

ตัวอย่างการตั้งค่า source object ของ FairPlay เพื่อส่ง Authorization Header

{
  src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
  type: 'application/x-mpegURL',
  drm: {
    fairplay: {
      certificateUrl: '<URL_TO_CERTIFICATE>',
      processSpcUrl: '<URL_TO_FAIRPLAY_LICENSE_SERVER>',
      licenseRequestHeaders: [
        {
          name: 'Authorization',
          value: '<YOUR_AUTHORIZATION_HEADER>'
        }
      ]
    }
  }
}

ตัวอย่างการตั้งค่า source object ของ FairPlay เมื่อใช้งาน extractContentId function

{
  src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
  type: 'application/x-mpegURL',
  drm: {
    fairplay: {
      certificateUrl: '<URL_TO_CERTIFICATE>',
      processSpcUrl: '<URL_TO_FAIRPLAY_LICENSE_SERVER>',
      extractContentId: function(initDataUri) {
          var uriParts = initDataUri.split('://', 1);
          var protocol = uriParts[0].slice(-3);
          uriParts = initDataUri.split(';', 2);
          var contentId = uriParts.length > 1 ? uriParts[1] : '';
          return protocol.toLowerCase() == 'skd' ? contentId : '';
      }
    }
  }
}

ตัวอย่างซอร์สโค้ด

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <div id="video-player"></div>
    <script src="https://byteark-sdk.cdn.byteark.com/player/v2/byteark-player.min.js"></script>
    <script>
      // Init ByteArk Player
      var player = bytearkPlayer('video-player', {
        fluid: true,
        poster: '/assets/samples/player/images/poster-big-buck-bunny.jpg',
        sources: [
          {
            title: 'Widevine Source',
            src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
            type: 'application/x-mpegURL',
            drm: {
              widevine: {
                url: '<URL_TO_WIDEVINE_LICENSE_SERVER>',
                licenseRequestHeaders: [
                  {
                    name: 'Authorization',
                    value: '<YOUR_AUTHORIZATION_HEADER>'
                  }
                ]
              }
            }
          },
          {
            title: 'FairPlay Source',
            src: 'https://byteark-playertzxedwv.stream-playlist.byteark.com/streams/TZyZheqEJUwC/playlist.m3u8',
            type: 'application/x-mpegURL',
            drm: {
              fairplay: {
                certificateUrl: '<URL_TO_CERTIFICATE>',
                processSpcUrl: '<URL_TO_FAIRPLAY_LICENSE_SERVER>',
                licenseRequestHeaders: [
                  {
                    name: 'Authorization',
                    value: '<YOUR_AUTHORIZATION_HEADER>'
                  }
                ]
              }
            }
          }
        ],
        plugins: {
          bytearkShaka: {
          }
        }
      });
      window.player = player;
    </script>
  </body>
</html>