HTML5에서 RTSP 또는 RTP를 통한 스트리밍
서버 http://lscube.org/projects/feng 에서 RTSP / RTP 스트림을 재생 해야하는 웹 응용 프로그램을 만들고
있습니다.
HTML5 비디오 / 오디오 태그가 rtsp 또는 rtp를 지원합니까? 그렇지 않다면 가장 쉬운 해결책은 무엇입니까? 아마도 VLC 플러그인이나 그와 비슷한 것으로 드롭 다운 될 것입니다.
기술적으로 '예'
(그러나 실제로는 아닙니다 ...)
HTML 5의 <video>
태그는 프로토콜에 구애받지 않으며 상관 없습니다. src
URL의 일부로 속성에 프로토콜을 배치합니다 . 예 :
<video src="rtp://myserver.com/path/to/stream">
Your browser does not support the VIDEO tag and/or RTP streams.
</video>
아니면
<video src="http://myserver.com:1935/path/to/stream/myPlaylist.m3u8">
Your browser does not support the VIDEO tag and/or RTP streams.
</video>
즉, <video>
태그 의 구현 은 브라우저마다 다릅니다. HTML 5의 초기 단계이기 때문에 자주 변경되는 지원 (또는 지원 부족)이 예상됩니다.
W3C의 HTML5 사양 ( 비디오 요소 )에서 :
사용자 에이전트는 모든 비디오 및 오디오 코덱 및 컨테이너 형식을 지원할 수 있습니다
제 생각에 그 질문의 정신은 진정으로 대답되지 않았습니다. 아니요, 현재로서는 비디오 태그를 사용하여 rtsp 스트림을 재생할 수 없습니다. Chromium 사용자의 'never'링크에 대한 다른 답변은 링크 된 스레드 / 응답이 동영상 태그를 통해 rtsp를 재생하는 Chrome을 직접 참조하지 않기 때문에 약간 오해의 소지가 있습니다. 링크 된 전체 스레드, 특히 맨 아래에있는 주석과 다른 스레드에 대한 링크를 읽으십시오.
실제 답변은 다음과 같습니다. 아니요, HTML 5 페이지에 비디오 태그를 넣고 rtsp를 재생할 수는 없습니다. 스트리밍 비디오를 재생하려면 일종의 Javascript 라이브러리를 사용해야합니다 (플래시 및 silverlight 플레이어로 음악을 재생하려는 경우 제외). {IMHO} html 5 비디오 토론 및 구현이 진행되는 속도에 따라 독점 비디오 표준의 다양한 공급 업체는 이러한 발전에 도움이되지 않으므로 브라우저 제작자가 제공하지 않는 한 비디오 태그의 사용 편의성을 고려하지 마십시오. 어떻게 든 문제를 해결하기 위해 스스로 해결해야합니다. 다시는 아닐 것입니다. {/ IMHO}
이것은 오래된 qustion이지만 최근에 직접 수행해야했고 무언가를 달성했습니다 (내 것과 같은 응답은 시간을 절약 할 수 있습니다) : 기본적으로 ffmpeg를 사용하여 컨테이너를 HLS, 대부분의 IPCam 스트림 h264 및 일부로 변경하십시오 PCM의 기본 유형이므로 다음과 같이 사용하십시오.
ffmpeg -v info -i rtsp://ip:port/h264.sdp -c:v copy -c:a copy -bufsize 1835k -pix_fmt yuv420p -flags -global_header -hls_time 10 -hls_list_size 6 -hls_wrap 10 -start_number 1 /var/www/html/test.m3u8
그런 다음 HLS 플러그인 과 함께 video.js 를 사용 하십시오. 이것은 라이브 스트림을 훌륭하게 재생합니다 두 번째 링크에는 jsfiddle 예제도 있습니다)
참고 : 이것은 기본 지원이 아니지만 사용자 프론트 엔드에 추가 항목이 필요하지 않습니다.
Chrome은 RTSP 스트리밍 지원을 구현하지 않습니다.
적어도, 크롬 개발자의 말에 여기 :
우리는 이것에 대한 지원을 추가하지 않을 것입니다
HTML5에는 세 가지 스트리밍 프로토콜 / 기술이 있습니다.
라이브 스트리밍, 짧은 대기 시간-WebRTC-Websocket
VOD 및 라이브 스트리밍, 높은 대기 시간-HLS
1. WebRTC
실제로 WebRTC는 SRTP (secure RTP protocol)입니다. 따라서 비디오 태그는 WebRTC를 통해 간접적으로 RTP (SRTP)를 지원한다고 말할 수 있습니다.
따라서 Chrome, Firefox 또는 다른 HTML5 브라우저에서 RTP 스트림을 얻으려면 SRTP 스트림을 브라우저로 전달하는 WebRTC 서버가 필요합니다.
2. 웹 소켓
TCP 기반이지만 HLS보다 대기 시간이 짧습니다. 다시 Websocket 서버가 필요합니다.
3. HLS
VOD (사전 녹화 된 비디오)에 가장 많이 사용되는 대기 시간이 긴 스트리밍 프로토콜입니다.
VLC를 사용하면 라이브 RTSP 스트림 (mpeg4)을 OGG 형식 (Vorbis / Theora)의 HTTP 스트림으로 트랜스 코딩 할 수 있습니다. 품질은 좋지 않지만 Chrome 9에서는 비디오가 작동합니다. WEBM (VP8)의 코드 변환으로 테스트했지만 작동하지 않는 것 같습니다 (VLC에는 옵션이 있지만 실제로 구현되었는지는 알 수 없습니다). .)
이것에 대한 의사를 가진 첫 번째 사람은 우리에게 알려 주어야합니다.)
HTML 5 비디오 태그 및 rtsp (rtp) 스트림에 대한 나의 관찰은 konqueror (KDE 4.4.1, Phonon 백엔드는 GStreamer로 설정)에서만 작동한다는 것입니다. H.264 / AAC RTSP (RTP) 스트림이있는 비디오 (오디오 없음) 만 받았습니다.
http://media.esof2010.org/ 의 스트림은 konqueror (KDE 4.4.1, Phonon-backend가 GStreamer로 설정 됨)에서 작동하지 않았습니다.
Chrome은 RTSP 스트리밍 지원을 구현하지 않습니다. WebRTC를 확인하는 중요한 프로젝트.
"WebRTC는 간단한 API를 통해 브라우저 및 모바일 애플리케이션에 RTC (Real-Time Communications) 기능을 제공하는 무료 공개 프로젝트입니다."
지원되는 브라우저 :
크롬, 파이어 폭스 및 오페라.
지원되는 모바일 플랫폼 :
안드로이드와 IOS
참고URL : https://stackoverflow.com/questions/1735933/streaming-via-rtsp-or-rtp-in-html5
'IT story' 카테고리의 다른 글
익명 유형을 가진 LINQ Select Distinct (0) | 2020.06.15 |
---|---|
두 개의 동일한 목록에 다른 메모리 공간이있는 이유는 무엇입니까? (0) | 2020.06.15 |
URL에서 프로토콜을 상속하기 위해 선행 이중 슬래시를 사용하는 데 단점이 있습니까? (0) | 2020.06.15 |
Chrome 브라우저 새로 고침 옵션 새로운 기능 (0) | 2020.06.15 |
명령 행 매개 변수에 액세스하는 방법? (0) | 2020.06.15 |