티스토리 뷰

IT 이야기

[hls.js] 실시간 영상 스트리밍 HTTP Streaming

하늘과 나b 2023. 2. 3. 13:20

hls.js를 이용해서 hls 영상을 실시간 스트리밍으로 전송해 보았습니다.

 

 

아래의 링크를 통해 hls.js 를 더 자세히 보실 수 있습니다.

 

hls.js 바로가기 : github.com/video-dev/hls.js/ 

 

 

아래와 같이 CDN을 이용해서 쉽게 구현이 가능합니다.

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>hls.js</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
</head>
<body>
<video controls autoplay id="video-player"></video>
<script>
	var video = document.getElementById('video-player');
	var videoSrc = 'http://{Domain or IP}:{Port}/{Application}/_definst_/mp4:{Path}/{File Name}/playlist.m3u8';
	//
	// First check for native browser HLS support
	//
	if (video.canPlayType('application/vnd.apple.mpegurl')) {
		video.src = videoSrc;
		//
		// If no native HLS support, check if hls.js is supported
		//
	} else if (Hls.isSupported()) {
		var hls = new Hls();
		hls.loadSource(videoSrc);
		hls.attachMedia(video);
	}
</script>
</body>
</html>

 

 

아래 사이트도 참고!

https://docs.gumlet.com/docs/insights-hlsjs-web

'IT 이야기' 카테고리의 다른 글

Ubuntu에서 nginx 설치하기  (0) 2023.11.09
보이스피싱 예방법  (1) 2023.10.17
[Ubuntu] 64bit 리눅스에서 32bit 실행파일(ELF) 실행방법  (0) 2023.04.13
RPA의 개념과 장단점  (0) 2023.02.24
To build a Node.js server using PM2 on Windows 10  (0) 2023.02.24
node.js 로 엑셀 파일 편집하기  (0) 2022.10.25
[VBA] 엑셀 매크로 실행시 처리 과정이 안 보이게 하는 방법  (0) 2022.06.20
리눅스 history 지우기  (0) 2022.05.30
[SSL] 어떤 DCV 인증 방법이 가장 편리하고 빠르나요?  (0) 2022.05.28
[SSL] HTTP/s DCV 인증용 .well-known 폴더(디렉토리) 생성 방법  (0) 2022.05.28
공유하기 링크
댓글