508. (javaScript) [기능 보완] 자바스크립트 nextToken 사용해 AWS HLS 비디오 스트림 리스트 목록 확인 - listStreams

---

[개발 환경 설정]

​

개발 툴 : Edit++

​

개발 언어 : JavaScript

​

 

---

[소스 코드]

​

-----------------------------------------------------------------------------------------
[사전 설명 및 설정 사항]
-----------------------------------------------------------------------------------------

- 개발 환경 : Web


- 개발 기술 : JavaScript (자바스크립트) / AWS / HLS / listStreams


- 사전) 👉 비디오 스트림 간략 설명 정리 : 

  >> 비디오 스트림은 라이브 비디오 및 기타 시간이 인코딩된 데이터를 캡처하고, 선택적으로 저장하고, 실시간, 배치 혹은 애드혹 형식으로 데이터의 소비를 가능하게 할 수 있도록 해 주는 리소스입니다

  >> 일반적인 구성에서는 Kinesis 비디오 스트림은 데이터를 푸시해 주는 생산자가 하나만 있습니다 (실시간 스트리밍 데이터를 밀어 넣어주는 하드웨어 기기)


- 사전) 👉 HLS 개념 설명 : 

  >> HTTP 라이브 스트리밍으로 인터넷을 통해 소비자에게 미디어 콘텐츠를 제공하는 데 사용되는 스트리밍 프로토콜입니다

  >> HLS 는 Apple 장치에서 지원하는 유일한 형식입니다

  >> 미디어는 h.264 또는 h.265 인코딩된 비디오를 포함해야 하며 AAC 인코딩된 오디오는 선택 사항입니다

  >> 미디어 타입 유효한 값의 예로는 "video/h264" 및 "video/h264,audio/aac" 가 있습니다


- 사전) 👉 PlaybackMode 설명 : 

  >> 라이브, 라이브 재생 또는 아카이브된 온디맨드 데이터를 검색할지 여부입니다

-----------------------------------------------------------------------------------------





-----------------------------------------------------------------------------------------
[소스 코드]
-----------------------------------------------------------------------------------------

try {

  var accessKeyId = accessKeyEl.value;
  var secretAccessKey = secretKeyEl.value;
  var region = regionEl.value;


  if (accessKeyId != null && accessKeyId != '' && secretAccessKey != null && secretAccessKey != '' && region != null && region != '') {

    var confirm = window.confirm('\n' + region + ' 리전 HLS 비디오 스트림 리스트를 조회하시겠습니까?\n\nAws Credential AccessKey : ' + accessKeyId + '\n\nAws Credential secretAccessKey : ' + secretAccessKey + "\n");
    if(confirm == true){
      console.log("confirm : 확인 클릭");

      // [내부 클로저 선언 실시]
      var innerFunction = null;

      // [조회 된 정보를 담을 배열 선언]
      const selectAllList = [];

      // [반복 조회를 위한 nextToken 변수 선언]
      var nextToken = null;

      startLoading();

      // -----------------------------------------
      // [AWS.config 지정]
      // -----------------------------------------
      // IAM 계정 정보를 사용해 AWS.config 정보 업데이트 수행
      // -----------------------------------------            
      AWS.config.update({
        region: region,
        accessKeyId: accessKeyId,
        secretAccessKey: secretAccessKey
      });



      // -----------------------------------------
      // [AWS 객체 생성]
      // -----------------------------------------
      const aws = new AWS.KinesisVideo();


      // -----------------------------------------
      // [내부 클로저 함수 정의]
      // -----------------------------------------
      innerFunction = async function() {

        try {
          
          while (true) { // 반복 조회 수행

            // -----------------------------------------
            // [요청 파라미터 생성]
            // -----------------------------------------
            /*
            {
              "MaxResults": number,
              "NextToken": "string",
              "StreamNameCondition": { 
                  "ComparisonOperator": "string",
                  "ComparisonValue": "string"
              }
            }
            */
            // -----------------------------------------
            var param = null;

            if (nextToken !== null && nextToken  !== undefined && nextToken  !== ''){
              param = {
                MaxResults: 500, // 반환할 결과의 최대 개수입니다 
                NextToken : nextToken
              };
            }
            else {
              param = {
                MaxResults: 500, // 반환할 결과의 최대 개수입니다 
              };
            }


            // -----------------------------------------
            // [ListStreams] : Aws HLS 비디오 스트림 리스트 목록 조회
            // -----------------------------------------
            // AWS 참고 사이트 : https://docs.aws.amazon.com/ko_kr/kinesisvideostreams/latest/dg/API_ListStreams.html
            // -----------------------------------------             
            var resMessage = "";

            const [err, res] = await aws.listStreams( param ).promise()               
              .then(data => [null, data])
              .catch(error => [error, null]);

            if (err) {
              console.error("[listStreams] : [Error] : ", err);

              // [반복 조회 종료 위한 토큰 값 초기화]
              nextToken = null;

            } else {
              console.log("[listStreams] : [Result] : ", JSON.stringify(res));

              // ---------------------------------------------
              // [로그 출력 예시 첨부]
              // ---------------------------------------------

              /*
              {
                "NextToken": "string",
                "StreamInfoList": [ 
                    { 
                      "CreationTime": number,
                      "DataRetentionInHours": number,
                      "DeviceName": "string",
                      "KmsKeyId": "string",
                      "MediaType": "string",
                      "Status": "string",
                      "StreamARN": "string",
                      "StreamName": "string",
                      "Version": "string"
                    }
                ]
              }
              */
              // ---------------------------------------------


              // ---------------------------------------------
              // [배열에 전체 리스트 정보 추가]
              // ---------------------------------------------
              const resList = res.StreamInfoList;

              if (resList != null && resList != undefined && Array.isArray(resList) && resList.length > 0){
                selectAllList.push(...resList); // ✅ Array Add List
              }


              // ---------------------------------------------
              // [반복 조회에 사용 될 nextToken 정보가 있는지 확인]
              // ---------------------------------------------
              const resNextToken = res.NextToken;
              if (resNextToken !== null && resNextToken !== undefined && resNextToken !== ''){
                nextToken = resNextToken; // ✅ Set
              }
              else {
                nextToken = null; // Clear
              }

            }


            // ---------------------------------------------
            // [반복 조회에 사용 될 nextToken 정보가 있는지 확인 후 무한 루프 탈출 수행]
            // ---------------------------------------------
            if (nextToken == null || nextToken == undefined || nextToken == ''){
              console.error("[innerFunction] : [nextToken] : Is Null >> Stop While True");
              break;
            }
            else {
              console.warn("[innerFunction] : [nextToken] : Exists >> Go To While True");
            }

          }


          console.log("");
          console.log("=========================================");
          console.log("[innerFunction] : Result");
          console.log("---------------------------------------");
          console.log("Total Length : ", selectAllList.length);
          console.log("---------------------------------------");
          console.log(JSON.stringify(selectAllList));
          console.log("=========================================");
          console.log("");


          // ---------------------------------------------
          // ✅ [에러가 발생한 이력이 있는지 체크 수행]
          // ---------------------------------------------
          if (resMessage == null || resMessage == undefined || resMessage == ''){ // 에러 발생 이력 없음
            console.log("[procedure] : [result] : ", JSON.stringify(selectAllList));
          }
          else {
            console.error("[procedure] : [error] : ", resMessage);
          }

        }
        catch(exception){
          console.error("[innerFunction] : [Exception] : ", exception);
        }

      };



      // -----------------------------------------
      // [내부 클로저 함수 호출]
      // -----------------------------------------
      innerFunction();

    }
    else {
      console.log("confirm : 취소 클릭");
    }
  
  }
  else {
    alert('❌ MQTT 테스트 클라이언트 접속 정보에 입력 된 AccessKey , SecretKey , Region 정보가 올바르지 않습니다. (Data is null)');
  }

}
catch (exception) {
  console.error("[streamListButton] : [Exception] : 예외 상황 발생 : ", exception);
}

-----------------------------------------------------------------------------------------





-----------------------------------------------------------------------------------------
[참고 사이트]
-----------------------------------------------------------------------------------------

[자바스크립트 AWS Kvs HLS 생성 된 비디오 스트림 ARN 리스트 목록 확인 - listStreams]

https://kkh0977.tistory.com/8352

https://blog.naver.com/kkh0977/224055636539?trackingCode=blog_bloghome_searchlist


[자바스크립트 AWS Kvs HLS 비디오 스트림 채널 생성 수행 - createStream]

https://kkh0977.tistory.com/8276

https://blog.naver.com/kkh0977/223916957964?trackingCode=blog_bloghome_searchlist


[자바스크립트 AWS Kvs HLS 비디오 스트림 채널 삭제 수행 - deleteStream]

https://kkh0977.tistory.com/8098

https://blog.naver.com/kkh0977/223918327833?trackingCode=blog_bloghome_searchlist

-----------------------------------------------------------------------------------------

 

---

[참고 사이트]

​

https://kkh0977.tistory.com/8352

424. (javaScript) 자바스크립트 AWS Kvs HLS 생성 된 비디오 스트림 ARN 리스트 목록 확인 - listStreams

---