KKCompany-TMT#9-Music Streaming Player A guide to DRM and cross-platform development issues

by Ben Wu

Slide 1

Slide 1 text

揭開音樂串流播放器的世界：探索 DRM 和跨平台開發的挑戰 Music Streaming Player A guide to DRM and cross-platform development issues

Slide 2

Slide 2 text

● I’m Ben Wu（吳建勳） ● Back-end engineer ● 2 years at KKBOX ● Prepare for K8s CKA recently ● My cat is cute Self introduction

Slide 3

Slide 3 text

04 Takeway 03 Issues during developing 02 Build a music streaming player 01 Background Agenda

Slide 4

Slide 4 text

Background

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

The moment I joined KKBOX…

Slide 7

Slide 7 text

The moment I joined KKBOX…

Slide 8

Slide 8 text

Build a music streaming player

Slide 9

Slide 9 text

Requirements DRM Protect digital content Cross-platform Reach more users Audio ﬁle Essential for player

Slide 10

Slide 10 text

● DRM refers to a set of technologies used to protect the rights associated with digital content. ● It is primarily used to control access, usage, and distribution of copyrighted material, such as movies, music, e-books, and software. ● DRM systems employ encryption, licensing, and access control mechanisms to enforce restrictions on how digital content can be used and distributed. ● The purpose of DRM is to prevent unauthorized copying, sharing, and piracy of digital content, while allowing content owners to monetize and control their intellectual property. Digital Rights Management (DRM)

Slide 11

Slide 11 text

source: https://community.roonlabs.com/t/kkbox-roon-integration-is-coming/230277/17 https://www.ithome.com.tw/news/95627

Slide 12

Slide 12 text

Digital Rights Management (DRM) ● DRM refers to a set of technologies used to protect the rights associated with digital content. ● It is primarily used to control access, usage, and distribution of copyrighted material, such as movies, music, e-books, and software. ● DRM systems employ encryption, licensing, and access control mechanisms to enforce restrictions on how digital content can be used and distributed. ● The purpose of DRM is to prevent unauthorized copying, sharing, and piracy of digital content, while allowing content owners to monetize and control their intellectual property.

Slide 13

Slide 13 text

End user Digital Rights Management (DRM) Content owner Developer • Usage rules • Support creators #Support genuine • Copyright protection • Safeguard revenue • License management #Guaranteed income • Hard to develop • Some features are limited #Err #Q_Q

Slide 14

Slide 14 text

• Concern about restrictions • Advocate for user rights #nonproﬁt organization #liberties #digital world W3C World Wide Web Consortium Digital Rights Management (DRM) • Develope standards • Create a balance #nonproﬁt organization #standard #develop #rules EFF Electronic Frontier Foundation

Slide 15

Slide 15 text

Digital Rights Management (DRM)

Slide 16

Slide 16 text

How do browsers play media with DRM? source: https://unsplash.com/photos/V7z8MGbfF5Q

Slide 17

Slide 17 text

EME Encrypted Media Extensions Provide mechanisms for encrypting digital content CDM Content Decryption Module Decrypt data content protected by EME EME? MSE? CDM? MSE Media Source Extensions Allow websites to access digital content

Slide 18

Slide 18 text

1 2 Manifest Encrypted Media (Chunks) License 3 EME? MSE? CDM?

Slide 19

Slide 19 text

Code examples of EME - requestMediaKeySystemAccess Safari

Slide 20

Slide 20 text

Code examples of EME - requestMediaKeySystemAccess Chrome

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

Issues during developing

Slide 23

Slide 23 text

Integrating DRM-protected audio ﬁles

Slide 24

Slide 24 text

Integrating DRM-protected audio ﬁles

Slide 25

Slide 25 text

iPad/iOS sound control

Slide 26

Slide 26 text

Safari Chrome

Slide 27

Slide 27 text

Safari Chrome

Slide 28

Slide 28 text

Safari Chrome

Slide 29

Slide 29 text

iPad/iOS sound control User-Agent from Safari cannot conﬁrm the type of device iPad/iOS doesn’t allow adjusting volume using JavaScript

Slide 30

Slide 30 text

Auto-play

Slide 31

Slide 31 text

Auto-play

Slide 32

Slide 32 text

Auto-play

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

Takeaway

Slide 38

Slide 38 text

● DRM aims to protect copyright, but in some aspects, it can also cause certain harm to user rights. ● There are open-source DRM players available in the market, so you don't have to reinvent the wheel. ● EME is an optional feature that enables browsers to have the capability to play DRM-protected content. ● MSE allows streaming media to have a more diverse set of playback mechanisms, such as dynamic playback and caching. ● CDM is a decryption module provided by various DRM vendors. ● iPad/iOS doesn’t allow adjusting volume using JavaScript ● User-Agent from Safari cannot conﬁrm the type of device ● If there is an autoplay function, pay attention to the auto-play policy Takeaway

Slide 39

Slide 39 text

Thanks !

Slide 40

Slide 40 text

● https://web.dev/media-eme/#how-does-eme-work ● https://shaka-player-demo.appspot.com/docs/api/tutorial-fairplay.html ● https://developer.mozilla.org/en-US/docs/Web/API/Navigator/requestM ediaKeySystemAccess ● https://developer.mozilla.org/en-US/docs/Web/API/Encrypted_Media_Ex tensions_API ● https://developer.mozilla.org/en-US/docs/Web/API/Media_Source_Exten sions_API ● https://www.youtube.com/watch?v=hUeGT91deSM resource