200. (TWOK/LOGIC) [Web] 자바스크립트 AWS Kvs HLS getHLSStreamingSessionURL 호출 시 타이밍 이슈 발생 API 호출 재시도 로직

---

[로직 정리]

​

정리 로직 : Web / JavaScript

​

제 목 : [Web] 자바스크립트 AWS Kvs HLS getHLSStreamingSessionURL 호출 시 타이밍 이슈 발생 API 호출 재시도 로직

​

 

---

[설 명]

​

// --------------------------------------------------------------------------------------
[사전) 설정 및 정보 확인 사항]
// --------------------------------------------------------------------------------------

1. 제 목 : [Web] 자바스크립트 AWS Kvs HLS getHLSStreamingSessionURL 호출 시 타이밍 이슈 발생 API 호출 재시도 로직


2. 테스트 환경 : Web / JavaScript / chrome


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

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

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


4. 사전) 👉 HLS 개념 설명 : 

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

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

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

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


5. 사전) 👉 PlaybackMode 설명 : 

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

// --------------------------------------------------------------------------------------






// --------------------------------------------------------------------------------------
[로직 설명]
// --------------------------------------------------------------------------------------

------------------------------------------------------
🟦 사전 정리) 로직 구현 관련 필요 내용 정리
------------------------------------------------------

1. AWS Kinesis Video Streams (KVS) HLS 스트리밍 환경에서는 타이밍 이슈로 인해 getHLSStreamingSessionURL() 호출이 일시적으로 실패하는 경우가 실제로 발생해 보완 로직 구현 필요


2. getHLSStreamingSessionURL() 호출이 실패할 수 있는 발생 원인 정리 : 

  >> Fragment 인덱싱 지연 : Producer 가 KVS 에 영상을 업로드한 직후에는 실제 영상 데이터는 이미 업로드되고 있어도 Fragment 인덱싱 완료 전 상태라면 실패할 수 있습니다.

  >> Stream 생성 직후 : Stream 생성 직후 바로 PutMedia 를 하는 경우 GetDataEndpoint , GetHLSStreamingSessionURL 이 내부적으로 아직 준비되지 않은 상태일 수 있습니다.

  >> Live Edge 생성 전 : PlaybackMode.LIVE 사용 시 최소 몇 개 Fragment 가 쌓여야 HLS Playlist 가 생성됩니다.

  >> AWS 내부 Eventually Consistent 특성 : KVS 도 완전한 Strong Consistency 기반 서비스는 아닙니다. 상황이 간헐적으로 발생할 수 있습니다.



------------------------------------------------------
🟦 로직 정리) 자바스크립트에서 HLS 뷰어 재생 및 getHLSStreamingSessionURL 재시도 로직
------------------------------------------------------

1. AWS IAM 계정 AccessKey , SecretKey 정보를 사용해 kinesisVideoClient = new AWS.KinesisVideo 초기화 수행


2. kinesisVideoClient 를 사용해서 KVS 스트림 엔드포인트 가져오기 수행 

  kinesisVideoClient.getDataEndpoint({
    StreamName: parse_streamName,
    APIName: 'GET_HLS_STREAMING_SESSION_URL'
  })


3. 획득한 response.DataEndpoint; 정보를 사용해서 엔드포인트를 기반으로 HLS 세션 URL 가져오기 KinesisVideoArchivedMedia 초기화 수행

  kinesisVideoArchivedMedia = new AWS.KinesisVideoArchivedMedia({
    region: region,
    endpoint: endpoint,
    accessKeyId: accessKeyId,
    secretAccessKey: secretAccessKey
  });


4. kinesisVideoArchivedMedia.getHLSStreamingSessionURL HLS 세션 URL 가져오기 요청 수행 및 에러 발생 시 반복 요청 코드 작성

  kinesisVideoArchivedMedia.getHLSStreamingSessionURL( params , function(err, response){
    if (err){

      // ✅ [에러 발생 시 일정 시간 딜레이 후 getHLSStreamingSessionURL 재시도 요청 수행]
      if (retryCnt < 6){

          retryCnt ++; // 카운트 증가

          console.error("[getLiveHLSUrl] : [getHLSStreamingSessionURL] : 타이머 대기 및 재시도 수행 : ", retryCnt);

          // 10초(10000ms) 대기 후 함수 실행
          setTimeout(() => {
              getLiveHLSUrl(region, endpoint, accessKeyId, secretAccessKey, streamName, hlsStreamType);
          }, 5000);
      }
      else {
        
          var errMsg = err.message;

          if (errMsg.indexOf("No fragments found in the stream for the streaming request") >= 0){
              errMsg += "\n\n" + "현재 재생 되고 있는 스트리밍이 없습니다. 스트리밍 재생 여부를 다시 확인해주세요." + "\n";
          }

          C_SweetAlert_Error_OK("알 림", "스트림 영상 재생 중 문제가 발생 했습니다. [getHLSStreamingSessionURL] : [Error] : " + errMsg, "확인");

          return;

      }
    }
    else {

      // ✅ [정상 URL 확인이 성공 한 경우]
      const hlsUrl = response.HLSStreamingSessionURL;

      const hls = new Hls(); // Default
      
      hls.loadSource(hlsUrl);
      hls.attachMedia(remoteView);

      hls.on(Hls.Events.ERROR, function(event, data){

          console.error("-");
          console.error("=========================================");
          console.error("[getLiveHLSUrl] : [getHLSStreamingSessionURL] : Hls.Events.ERROR");
          console.error("-----------------------------------------");
          console.error("[ERROR] : ", JSON.stringify(data));
          console.error("-----------------------------------------");
          console.error("[data.type] : ", data.type);
          console.error("-----------------------------------------");
          console.error("[data.details] : ", data.details);
          console.error("-----------------------------------------");
          console.error("[data.fatal] : ", data.fatal);
          console.error("=========================================");
          console.error("-");

          // [에러 분기 처리 시 사용]
          // if (data.details === 'bufferStalledError'){ }
          // if (data.details === 'bufferStalledError'){ }

      });

    }

  })



------------------------------------------------------
🟦 참고 사항) Retry 가 필요한 에러와 필요 없는 에러 정리
------------------------------------------------------

1. Retry 권장 : 

  >> ResourceNotFoundException

  >> ClientLimitExceededException

  >> ConnectionTimeout

  >> SocketTimeout

  >> InternalFailure


2. Retry 불필요 : 

  >> AccessDeniedException

  >> InvalidCodecPrivateDataException

  >> InvalidArgumentException

  >> ExpiredTokenException

// --------------------------------------------------------------------------------------






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

▶️ [Web/JavaScript] AWS Kvs HLS 뷰어 Viewer 비디오 스트림 영상 재생 수행

https://kkh0977.tistory.com/8269

https://blog.naver.com/kkh0977/224004858035


▶️ [Aws Kinesis Video Streams] Aws KVS 비디오 스트림 , 신호 전송 채널 차이점 설명 정리

https://kkh0977.tistory.com/7956

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


▶️ [Aws Kvs HSL 비디오 스트림 녹화 영상 관련 학습 정리]

https://kkh0977.tistory.com/7967

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


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

https://kkh0977.tistory.com/8276

https://blog.naver.com/kkh0977/223916957964


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

https://kkh0977.tistory.com/8098

https://blog.naver.com/kkh0977/223918327833


▶️ [JavaScript] The FragmentSelector is required for LIVE_REPLAY PlaybackMode

https://kkh0977.tistory.com/8256

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


▶️ [JavaScript] No fragments found in the stream for the streaming request

https://kkh0977.tistory.com/8257

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

// --------------------------------------------------------------------------------------

 

---

[참고 사이트]

​

https://kkh0977.tistory.com/8269

165. (TWOK/UTIL) [Web/JavaScript] AWS Kvs HLS 뷰어 Viewer 비디오 스트림 영상 재생 수행

---