본문 바로가기
토이프로젝트/[스트리밍] 동영상 스트리밍 서비스 개발하기

[스트리밍] MPEG-DASH와 MSE(MediaSource Extensions)에 관하여 - 3

by 프룹 2022. 3. 4.
반응형

이번 시간에는 MediaSource Extension이라고 하는 기술을 이용해 MPEG-DASH 표준을 따른 동영상 스트리밍 서비스를 구축하기 위해 알아야 할 사전 지식을 공부하고자 한다.

 

# dash와 hls의 유사점

결국엔 dash든 hls든 영상을 쪼갠다는 점은 동일하다. 다만, 어떻게 영상을 쪼개는지, 쪼개진 영상이 어떤 방식으로 준비되어야 하는지, 영상/음성 인코딩이 무엇인지에 따라 방식이 달라지게 된다.

 

# dash를 선택한 이유

일단 프로젝트를 하면서 최대한 써드파티 라이브러리 사용은 자제하자. 즉, 최대한 Low 하게 구현해보자를 목표로 삼게 되었다. 엄청 자세하게 알아본 건 아니지만, dash를 이용할 수 있는 built-in API가 바로 MSE였다. 나와있는 dash.js, jwplayer, shaka player 등이 다 내부적으론 MSE를 이용해서 구현된다. 반면에 hls는 어떤 게 built-in API인지 찾을 수 없었다. 이 때문에 dash를 이용한 프로젝트를 시작하게 되었다.

 

# MSE란

MSE란 MediaSource Extension이라는 브라우저 API이다. 즉, 브라우저에 내장된 API로 MediaSource 객체를 생성하고, 버퍼를 통해 <video>태그에 영상을 제공해주는 역할을 한다. 이 MSE는 브라우저 내장 API이기 때문에 Node.js는 필요하지 않다.

 

# 영상을 내 맘대로 쪼개면 되나요?

사실 초기에 이 부분때문에 막힌 게 많았다. 일단 기본적으로 dash는 mp4 확장자를 따라야 하는 것 같다. 또 브라우저에서 지원해주는 영상/음원 인코딩이 따로 있기 때문에 해당 인코딩으로 변환하는 작업도 거쳐야 한다. 이때, 이 인코딩의 종류를 아는 것이 대단히 중요하다. 왜냐면 MSE에 해당 동영상의 인코딩을 올바르게 명시하지 않는다면 영상이 재생되지 않기 때문이다. 그밖에 재생이 되지 않는 여러 이유도 있지만,,,

그리고 중요한, 쪼개는 방식에 대해, 우리는 MP4의 구조가 어떻게 이루어져 있는지 한 번은 알 필요가 있다. 왜냐면 그래야 FFMPEG를 사용하는 이유를 납득할 수 있기 때문이다. 아니면 그 구조를 공부해서 직접 FFMPEG와 같은 프로그램을 구축해야한다.

두 번째 MP4 링크는 MP4 헤더는 아니지만, 유용한 사이트라 링크를 걸어주었다. 이 부분에 대해 하고 싶은 말은 다음 포스팅인 dash표준을 따르는 영상 준비하기 편에서 소개하려고 한다.

반응형

댓글