JavaScript
409. (javaScript) 자바스크립트 AWS Kvs HLS 비디오 스트림 채널 생성 수행 - createStream
투케이2K
2025. 6. 30. 19:21
728x90
[개발 환경 설정]
개발 툴 : Edit++
개발 언어 : JavaScript
[소스 코드]
-----------------------------------------------------------------------------------------
[사전 설명 및 설정 사항]
-----------------------------------------------------------------------------------------
- 개발 환경 : Web
- 개발 기술 : JavaScript (자바스크립트) / AWS / Kvs / HLS / createStream
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
[소스 코드]
-----------------------------------------------------------------------------------------
<!DOCTYPE HTML>
<html lang="ko">
<head>
<title>javaScriptTest</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 반응형 구조 만들기 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<!-- 내부 CSS 스타일 지정 -->
<style>
html, body {
width: 100%;
height: 100%;
margin : 0 auto;
padding : 0;
border : none;
background-color: #666;
}
</style>
<!-- [CDN 주소 설정] -->
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.1416.0.min.js"></script>
<!-- [자바스크립트 코드 지정] -->
<script>
// --------------------------------------------------------------------------------------------------------------
// [전역 변수 선언]
var region = 'ap-northeast-1'; // [AWS 리전]
var accessKeyId = 'AK..7Q'; // [IAM 액세스 키]
var secretAccessKey = 'Zz..xj'; // [IAM 시크릿 키]
// --------------------------------------------------------------------------------------------------------------
// [html 최초 로드 및 이벤트 상시 대기 실시]
window.onload = function() {
console.log("");
console.log("=========================================");
console.log("[window onload] : [start]");
console.log("=========================================");
console.log("");
/**
* -----------------------------------------
* [요약 개념 정리]
* -----------------------------------------
* 비디오 스트림 이란 :
*
* 비디오 스트림은 라이브 비디오 및 기타 시간이 인코딩된 데이터를 캡처하고, 선택적으로 저장하고, 실시간, 배치 혹은 애드혹 형식으로 데이터의 소비를 가능하게 할 수 있도록 해 주는 리소스입니다
* 일반적인 구성에서는 Kinesis 비디오 스트림은 데이터를 푸시해 주는 생산자가 하나만 있습니다 (실시간 스트리밍 데이터를 밀어 넣어주는 하드웨어 기기)
* -----------------------------------------
* AWS KVS HLS 란 :
*
* HLS 는 Apple 장치에서 지원하는 유일한 형식입니다
* 미디어는 h.264 또는 h.265 인코딩된 비디오를 포함해야 하며 AAC 인코딩된 오디오는 선택 사항입니다
* -----------------------------------------
* CreateStream Request Params :
*
* StreamName : 생성하고 있는 스트림의 이름입니다. (AWS 계정 및 리전 각각 고유한 값 필요)
* MediaType : 스트림의 미디어 유형으로 스트림 소비자는 스트림을 처리할 때이 정보를 사용할 수 있습니다. (유효한 값의 예로는 "video/h264" 및 "video/h264,audio/aac"가 있습니다)
* Tags : 채널과 연결할 태그 세트(키-값 페어)입니다.
* -----------------------------------------
* 참고 사이트 :
*
* https://docs.aws.amazon.com/ko_kr/kinesisvideostreams/latest/dg/API_CreateStream.html#API_CreateStream_RequestSyntax
* -----------------------------------------
*/
// -----------------------------------------
// [AWS.config 지정]
// -----------------------------------------
AWS.config.update({
region: region,
accessKeyId: accessKeyId,
secretAccessKey: secretAccessKey
});
// -----------------------------------------
// [AWS.KinesisVideo 객체 생성]
// -----------------------------------------
const kvs = new AWS.KinesisVideo();
// -----------------------------------------
// [스트림 생성에 필요한 params 정의]
// -----------------------------------------
const params = {
StreamName: 'DEVICE_2',
MediaType: 'video/h264,audio/aac', // HLS에 적합한 코덱
DataRetentionInHours: 2, // 저장 시간 (HLS는 보통 짧게 설정)
Tags: { // 태그는 AWS 리소스에 할당하는 레이블입니다 (태그를 사용하여 리소스를 검색 및 필터링하거나 AWS 비용을 추적할 수 있습니다.)
StreamName: 'DEVICE_2',
Environment: 'Development'
}
};
// -----------------------------------------
// [AWS Kvs Stream 스트림 생성 수행 실시]
// -----------------------------------------
kvs.createStream(params, (err, data) => {
if (err) {
console.error("");
console.error("=========================================");
console.error("[createStream] : [Error]");
console.error("---------------------------------------");
console.error(err);
console.error("=========================================");
console.error("");
} else {
console.log("");
console.log("=========================================");
console.log("[createStream] : [Success]");
console.log("=========================================");
console.log("");
}
});
};
// --------------------------------------------------------------------------------------------------------------
</script>
</head>
<body>
</body>
</html>
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
[참고 사이트]
-----------------------------------------------------------------------------------------
[[Aws Kinesis Video Streams] Aws KVS 비디오 스트림 , 신호 전송 채널 차이점 설명 정리]
https://blog.naver.com/kkh0977/223854439046?trackingCode=blog_bloghome_searchlist
[Aws Kvs HSL 비디오 스트림 녹화 영상 관련 학습 정리]
https://blog.naver.com/kkh0977/223855980812?trackingCode=blog_bloghome_searchlist
[Aws KVS PutMedia 비디오 스트림 전송 API 설명 정리]
https://blog.naver.com/kkh0977/223856688678?trackingCode=blog_bloghome_searchlist
[업무 이슈] android 안드로이드 aws kvs hls 스트리밍 동영상 업로드 이슈 - mp4 파일 ffmpeg 트랜스코딩 mkv 파일 변환
https://blog.naver.com/kkh0977/223878649342?trackingCode=blog_bloghome_searchlist
-----------------------------------------------------------------------------------------
728x90
반응형