[javascript] Video.js를 사용하여 동영상 재생하는 방법은 어떻게 되나요?

24 Nov 2023

javascript

Video.js는 HTML5 동영상 재생을 위한 강력한 JavaScript 라이브러리입니다. 다음은 Video.js를 사용하여 동영상을 재생하는 간단한 예제입니다.

Video.js 라이브러리 설치하기

Video.js를 사용하려면 먼저 라이브러리를 다운로드하고 웹 페이지에 추가해야 합니다. 다음과 같이 <head> 태그 내에 스크립트를 추가합니다.

<head>
    <link href="https://vjs.zencdn.net/7.11.4/video-js.css" rel="stylesheet">
    <script src="https://vjs.zencdn.net/7.11.4/video.min.js"></script>
</head>

Video.js 플레이어 생성하기

다음은 Video.js를 사용하여 동영상을 재생하는 코드입니다. <video> 태그를 생성하고 Video.js 플레이어를 초기화합니다.

<body>
    <video id="my-video" class="video-js" controls>
        <source src="my-video.mp4" type="video/mp4">
    </video>

    <script>
        var player = videojs('my-video');
    </script>
</body>

동영상 제어하기

Video.js 플레이어를 통해 동영상을 제어할 수 있습니다. 다음은 간단한 제어 기능 예제입니다.

player.play(); // 동영상 재생
player.pause(); // 동영상 일시 정지
player.currentTime(30); // 동영상 재생 시간 이동

Video.js는 AJAX 요청, 자막, 플러그인 등 다양한 기능을 제공합니다. 자세한 내용은 Video.js 공식 문서를 참고하세요.