Programing/Streaming7

• 

  Browser RTSP, RTMP, HLS CCTV streaming 이슈 정리 Browser RTSP, RTMP, HLS CCTV streaming 이슈 정리 이번 포스팅에서는 브라우저에서 실시간 스트리밍 영상 표출 이슈 내용을 정리해보려 합니다. 제 이전 포스팅에 있는 내용은 브라우저별 정책 변경으로 현재와 맞지 않을 수 있습니다. 각 프로토콜에 대한 설명만 참고하시기 바랍니다. Link : aljjabaegi.tistory.com/240 HLS(Http Live Streaming) 웹에서 플레이 하는 방법 HLS(Http Live Streaming) 웹에서 플레이 하는 방법 웹에서 스트리밍 방식의 동영상을 재생하는 방법에는 RTSP (Real-Time Streaming Protocol), RTP(Real-Time Transport Protocol), RTMP( Real-Time.. Programing/Streaming 2021. 4. 28.

• 

  javascript VXG Media Player RTSP protocol paly in Chrome, 크롬에서 rtsp play javascript VXG Media Player RTSP protocol paly in Chrome, 크롬에서 rtsp play 이전 포스팅에서 RTSP, HLS 프로토콜을 Web Brower 상에서 플레이 하는 방법에 대해서 알아봤었습니다. Link : HLS(Http Live Streaming) 웹에서 플레이 하는 방법 Link : RTSP(Real Time Streaming Protocol) 웹에서 플레이 하는 방법 vlc player 활용 Link : HLS(Http Live Streaming) 웹에서 플레이 하는 방법(FlowPlayer 사용) Link : RTMP / RTSP 모바일 출력 이슈. 하지만 몇가지 이슈가 있었죠. 여러 보안상의 이유로 크롬에서는 VLC Player 가 정상작동 하.. Programing/Streaming 2018. 12. 26.

• 

  RTMP / RTSP 모바일 출력 이슈. RTMP / RTSP 모바일 출력 이슈. 기존에 웹 개발시 사용해 왔던 flowplayer 를 사용한 실시간 스트리밍은 모바일에서 동작 하지 않았습니다. (왜냐면 모바일에선 flowplayer에서 실시간 스트리밍을 위해 사용하는 flash 를 더이상 지원하지 않기 때문..) 이리저리 구글링 해본 결과 그냥 HLS 주소를 링크 걸어주면 간단히 해결됐습니다. 대부분의 스트리밍 서버는 RTSP / RTMP / HLS 포멧 변환은 기본적으로 지원을 합니다. 그래서 기존의 RTMP 주소를 HLS로 변경하여 링크를 걸어주니 안드로이드 및 IOS 기기에서 출력되는 것을 확인 하였습니다. 기존의 RTMP 주소를 HLS 주소로 변경하여 location.href = 'HLS주소'; Programing/Streaming 2017. 6. 12.

• 

  javascript 웹에서 RTMP 출력 상용 Flash Flowplayer 사용. ※Flowplayer 가격정책이 월마다 지출하는 것으로 변경되었습니다. 이점 참고 하세요. javascript 웹에서 RTMP 출력 상용 Flowplayer 사용. http://flash.flowplayer.org/plugins/streaming/rtmp.html 위의 주소를 클릭하면 Flash Flowplayer 를 사용해 RTMP를 라이브 스트리밍 할 수 있다는 것을 알수 있습니다. 하지만 이는 구매를 해야 사용이 가능합니다. 로컬 테스트 시는 문제가 없지만 도메인 등록을 하지 않으면 domain not allowed 라는 에러가 발생하게 됩니다. https://flowplayer.org/pricing/player.html 위의 페이지로 이동하게 되면 도메인 갯수에 따라 금액이 다른 것을 확인할 수 .. Programing/Streaming 2017. 4. 18.

• 

  HLS(Http Live Streaming) 웹에서 플레이 하는 방법(FlowPlayer 사용) HLS(Http Live Streaming) 웹에서 플레이 하는 방법(FlowPlayer 사용) 20170206추가 내용 - 아래 방식은 300불 정도의 유료 방식이다. - 로컬에서는 무료버젼으로 출력이 가능하다. 여러가지 방식의 CCTV 스트리밍 방식에 대해 알아보면서 각각의 장단점과 크로스도메인 이슈, 여러 플레이어들에 대해서 알게 되었다. 그중 HLS 방식은 별도의 ActiceX 설치 없이 스트리밍이 가능하기 때문에 대시민 페이지에서 사용하기 적절 하다고 판단 했다. 아래서 설명할 m3u8(HLS방식) 출력 코드는 xml 파일로 부터 cctrv 의 정보를 읽어들여 flow player 에서 출력하는 방식이다. cctv에 대한 정보를 다른 방식으로 받는다면 xml에서 데이터를 받는 부분은 생략하고 봐.. Programing/Streaming 2016. 12. 23.

• RTSP(Real Time Streaming Protocol) 웹에서 플레이 하는 방법 vlc player 활용 RTSP(Real Time Streaming Protocol) 웹에서 플레이 하는 방법 vlc player 활용 ※Chrome 에서는 RTSP Protocol 이 막혔습니다! 이번엔 HLS가 아닌 RTSP 주소를 웹에서 플레이 하는 방법에 대해서 알아보자. HLS와 달리 RTSP는 HTML5 Video 태그에서 아직 지원을 하지 않는 것으로 알고 있다. 그래서 별도의 ActiceX 나 PlugIn을 사용해야 한다. 아래 설명할 방법은 vlc player 를 사용해서 웹에 출력하는 방법이다. jsp 파일 내에 아라와 같이 object를 생성한다. 여기서 중요한 것은 codebase와 src 파라미터 이다.(bold처리된부분) 현재 코드 베이스에는 vlc play 설치파일 주소가 적혀있다. cab 파일을 만.. Programing/Streaming 2016. 8. 16.

• HLS(Http Live Streaming) 웹에서 플레이 하는 방법 HLS(Http Live Streaming) 웹에서 플레이 하는 방법 웹에서 스트리밍 방식의 동영상을 재생하는 방법에는 RTSP (Real-Time Streaming Protocol), RTP(Real-Time Transport Protocol), RTMP( Real-Time Messaging Protocol), HLS(Http Live Streaming) 방식 등이 있다. (참고로 RTSP는 1초, HLS는 10초 정도의 delay가 존재한다.) HLS를 제외하고는 현재 HTML5에서 지원은 하지 않기 때문에 가장 간단한 방법인 HLS로 웹에 동영상을 표출하는 방법을 알아보자. HTML5에서 제공하는 태그를 사용하여 HLS 동영상을 출력할 것이다. 이를 위해서는 video.min.js 와 videojs.. Programing/Streaming 2016. 8. 5.