326. (TWOK/ERROR) [JavaScript] The FragmentSelector is required for LIVE_REPLAY PlaybackMode

---

[환경 설정 및 설명]

​

프로그램 : Web / Chrome

​

설 명 : [JavaScript] The FragmentSelector is required for LIVE_REPLAY PlaybackMode

 

---

[설 명]

​

--------------------------------------------------------------------------
[개발 및 테스트 환경]
--------------------------------------------------------------------------

- 제목 : [JavaScript] The FragmentSelector is required for LIVE_REPLAY PlaybackMode


- 테스트 환경 : PC / Web / Chrome


- 사전) HLS 개념 설명 : 

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

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

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

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


- 사전) PlaybackMode 설명 : 

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

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





--------------------------------------------------------------------------
[에러 원인]
--------------------------------------------------------------------------

1. 자바스크립트에서 AWS KVS HLS 스트리밍 재생 시 PlaybackMode 값을 LIVE_REPLAY 로 지정했는데 해당 옵션 사용을 위한 추가 필수 파라미터 인 FragmentSelectorType 가 누락되어 발생하는 이슈


2. PlaybackMode 에서 LIVE_REPLAY 값 설명 : 

  >> HLS 미디어 재생 목록은 지정된 시작 시간의 조각을 포함하여 약간 이전 프래그먼트로부터 재생을 시작하는 방식입니다

  >> 해당 방식으로 재생을 하기 위해서는 반드시 FragmentSelector 를 포함해야하며, 어느 시점부터 재생할지 시작 시점 timestamp 값을 지정해야합니다

    - StartTimestamp : 최대 1시간 전까지 가능 (아카이브 설정에 따라 다름)

    - EndTimestamp : 보통 new Date()로 현재 시점
	  : 해당 값 지정 시 AWS는 그 시점까지만 프래그먼트를 포함한 HLS(m3u8) 리스트를 생성하고, 그 이후 프래그먼트는 재생되지 않습니다.
	  : 즉, 녹화 영상이 끝까지 재생 되지 않을 수 있음
	  : 녹화 영상을 끝까지 보고 싶은 경우 해당 값 지정을 하지 않고 StartTimestamp 만 지정

    - 시간 기준 : SERVER_TIMESTAMP 권장 (신뢰도 ↑)
	  : SERVER_TIMESTAMP (타임스탬프는 서버 시작 타임스탬프가 됩니다)
	  : PRODUCER_TIMESTAMP (타임스탬프는 생산자 시작 타임스탬프가 됩니다)

    - 타임스탬프 범위 : KVS 가 해당 범위의 .ts 프래그먼트를 자동 추출해 m3u8 생성

  >> 요약 설명 : 약간 이전 프래그먼트부터 재생 시작 (더 안정적 / 끊김 적고 재생 부드러움 / AWS 콘솔 대시보드에서 설정 되어 표시 되는 방식)


3. 에러 발생 로그 전문 : 

  The FragmentSelector is required for LIVE_REPLAY PlaybackMode

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





--------------------------------------------------------------------------
[해결 방법]
--------------------------------------------------------------------------

1. 자바스크립트에서 kinesisVideoArchivedMedia.getHLSStreamingSessionURL 호출 시 추가하는 파라미터에 FragmentSelectorType 값 추가 지정 실시


2. 소스 코드 예시 (타임 스탬프 없이 지정 방법) : 

const params = {
  StreamName: 'your-kvs-stream-name',
  PlaybackMode: 'LIVE_REPLAY', // ✅ LIVE_REPLAY 사용
  HLSFragmentSelector: {
    FragmentSelectorType: 'SERVER_TIMESTAMP', // 또는 PRODUCER_TIMESTAMP
    // TimestampRange는 생략 가능 — 지정 안 하면 KVS가 자동으로 최근 시점부터 시작
  }
};

kinesisVideoArchivedMedia.getHLSStreamingSessionURL(params, (err, data) => {
  if (err) {
    console.error("❌ Error getting HLS URL:", err);
    return;
  }

  const hlsUrl = data.HLSStreamingSessionURL;
  
});


3. 소스 코드 예시 (타임 스탬프 지정 방법) : 

const startTimestamp = new Date(Date.now() - 60 * 1000); // 1분 전
const endTimestamp = new Date(); // 현재

const params = {
  StreamName: 'your-kvs-stream-name',
  PlaybackMode: 'LIVE_REPLAY', // ✅ LIVE_REPLAY 사용
  HLSFragmentSelector: {
    FragmentSelectorType: 'SERVER_TIMESTAMP', // 또는 PRODUCER_TIMESTAMP
    TimestampRange: {
      StartTimestamp: startTimestamp,
      EndTimestamp: endTimestamp, // 해당 값 명시 시 실제 녹화 동영상 파일 보다 짧게 출력 될 수 있음
    }
  }
};

kinesisVideoArchivedMedia.getHLSStreamingSessionURL(params, (err, data) => {
  if (err) {
    console.error("❌ Error getting HLS URL:", err);
    return;
  }

  const hlsUrl = data.HLSStreamingSessionURL;
  
});

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





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

[AWS 사이트 : GetHLSStreamingSessionURL 설명]

https://docs.aws.amazon.com/ko_kr/kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#API_reader_GetHLSStreamingSessionURL_RequestSyntax


[업무 이슈] android 안드로이드 aws kvs hls 스트리밍 동영상 업로드 이슈 - mp4 파일 ffmpeg 트랜스코딩 mkv 파일 변환

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


[안드로이드 Raw 폴더에 저장 된 MKV 형식 파일 Aws Kvs HLS 비디오 스트리밍 업로드 수행]

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

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

 

---

[참고 사이트]

​

https://docs.aws.amazon.com/ko_kr/kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#API_reader_GetHLSStreamingSessionURL_RequestSyntax

GetHLSStreamingSessionURL - Amazon Kinesis Video Streams

---