반응형 HLS3 🥙 Hls 인증 🍕 Hls에서 token 담아서 전달 hls에서 이번에 http header에 토큰을 전달해야 하는 상황이 발생하였다. 인증은 사실 어느 프로그램이나 필요한 부분이다. 다행히 hls.js에서는 http header을 커스텀 할 수 있다. Hls.js에서 Header Custom 하기 xhrSetup 옵션을 통해 setRequestHeader 함수를 통해 헤더에 담아서 보내는 것이 가능하다. 하지만 ios/safari는 Hls.js를 사용할 수 없고, m3u8확장자를 지원하지만, Http header를 커스텀하는 것은 어렵다. 그리하여 쿼리스트링 방식으로 전달하는 방법 뿐이었다. 보안적으로는 안전하지는 않지만, 현재로서는 커스텀하는 방법이 존재 하지 않기 때문에 쿼리스트링으로 처리하였다. function .. 2024. 2. 22. 🍟Hls 콘텐츠 변경 감시 현재 Hls를 사용하는 도중 컨텐츠가 바뀌면 화면에 보여지는 정보가 바뀌어 하는 서비스를 제공하고있다. 근데 현재 interval으로 API를 호출하기 때문에 서버에 부담이 가고 있어서, 이번에 Hls에서 컨텐츠 변경감지 하는 법에 대해 알아보았다. 🥙 Hls.js에서의 변경 감지 🦴 Hls.js를 지원하는 경우 만약 Hls.js를 사용할 수 있는 상황이라면 아래 처럼, FRAG_CHANGED 이벤트가 트리거가 될때 , "DIS" 가 포함 되면 컨텐츠가 변경된것으로 감지가 된다. Hls에서 EXT-X-DISCONTINUITY은 컨텐츠 내용이 변경될때마다 발견되는 태그이다. 아래는 Hls.js사용할 수 있는 경우에 대한 코드이다. 현재는 배열의 길이로 체크를 했지만, 정확하게 할려면 "DIS"가 포함되면 .. 2023. 12. 4. Hls.js 사용 📺 HLS(Http Live Streaming) HLS(HTTP 라이브 스트리밍)은 가장 널리 사용되는 비디오 스트리밍 프로토콜입니다. HTTP "라이브" 스트리밍이라 불리지만 주문형 스트리밍이자 동시에 라이브 스트리밍입니다. HLS는 비디오 파일을 다운로드할 수 있는 HTTP 파일 조각으로 나누고 HTTP 프로토콜을 이용하여 전송합니다. 클라이언트 장치는 이러한 HTTP 파일을 로드한 후 비디오로 재생합니다. 🔋 Hls.js Hls.js는 http live streaming을 구현하는 javascript 라이브러리입니다. ios/safari 같은 경우 빌트인이 되어있기때문에 지원하지는 않고, 다른 브라우저에서는 Hls.js를 통해서 스트리밍이 가능합니다. 💰 Hls.js 라이브러리 사용 cdn 방식으로.. 2023. 6. 14. 이전 1 다음 반응형
