브라우저로 실시간 스트리밍

Question

나는 여기서 내 재치가 조금있다.

라이브 비디오 방송을 웹 브라우저로 스트리밍하려고합니다.

현재 ffmpeg를 사용하여 directshow 라이브 소스를 webm 스트림으로 node.js로 스트리밍 한 다음 <video> 요소의 HTTP 요청으로 스트림을 전달합니다. 지금까지 모든 것이 작동합니다.

라이브 소스 ->는 FFmpeg -> POST [WEBM] -> Node.js를 -> GET [WEBM] -> 비디오 태그

내 문제는 소스 클럭과 웹 클라이언트의 시계가 정확하지 않는다는 것입니다 서로 맞 춥니 다. 비디오의 경우 이것은 문제가되지 않으며 매 프레임을 떨어 뜨리거나 복제하는 것은 눈에 띄지 않습니다. 그러나 오디오의 경우에는 또 다른 문제입니다. 지금까지 파악한 바에 따르면 Chrome (또는 다른 브라우저)은 이러한 불일치를 보완하기 위해 ffmpeg에서 오디오 리샘플링 보정 (예 : swr_set_compensation)을 수행하지 않습니다. 대신에 재생 버퍼의 샘플이 부족할 때 소리가 들릴 정도로 왜곡됩니다 (큰 소리).

제 질문은 웹 브라우저에서 라이브 소스의 적절한 재생 (오디오)을 달성 할 수 있는지 여부입니다.

아직 재생을 위해 실버 라이트 또는 플래시를 사용하지 않았습니다. 아마도 더 잘 작동할까요? 그것이 오늘날의로 진전을 보이고 있지만 웹 브라우저로 스트리밍

Answer 1

라이브 미디어 (오디오/비디오)는 몇 년 수있다. 웹상의 미디어를위한 차세대 제품이며 Youtube와 같은 많은 플랫폼이 이미 장착되어 있습니다.

전형적인 라이브 미디어 스트리밍 시나리오는 다음과 같습니다

오디오/비디오 피드> 변환> 스트리밍> 선수 각 단계에서

여러 기술적 가능성을 사용할 수 있습니다. 그러나 나는 미디어 스트리밍 라이브에 대한 길은 독점 기술로 포장되어 있다고 이미 언급해야한다.

• 오디오/비디오 피드 : 생생하거나 매우 가볍게 압축 된 미디어 형식이며 인터넷에 업로드 할 수 없습니다. 코드 변환해야합니다. 캠을 컴퓨터에 가져 오려면 PCI Express 카드 또는 USB/벼락치 장치와 같은 잡기 장치를 사용해야 할 수도 있습니다.
• 트랜스 코딩 : 소프트웨어 (ffmpeg, 플래시 미디어 라이브 인코더, Wirecast) 또는 하드웨어 솔루션 (streamingmedia.com에는 here과 같은 풍부한 정보가 있습니다)이 있습니다. H264/AAC는 현재의 미디어 전문 표준이며 스트림은 종종 다른 네트워크 조건에 맞게 여러 변환 (비트 전송률)으로 변환됩니다.
• 스트리밍 : 라이브 스트림을 전달하려면 여러 기기를 타겟팅해야 할 가능성이 큽니다. 모든 장치가 동일한 스트리밍 프로토콜을 지원하는 것은 아닙니다. HLS는 Apple 기기 및 Android> 4.1에서 작동합니다. HDS 또는 RTMP는 Flash에서 작동하며 Silverlight에서 부드러운 스트리밍을 제공합니다. 하나의 프로토콜로 모든 장치에 연결할 수 없으므로이 경우 Wowza 또는 Red5와 같은 스트리밍 서버가 필요합니다. 스트리밍 서버는 트랜스 코딩 된 라이브 스트림을 입력으로 가져 와서 동시에 많은 수의 동시 연결을 유지하면서 장치 간 전송을 준비합니다 (현재는 드물지 않습니다). 또한 DVR이나 DRM과 같은 기능을 추가 할 수 있습니다. 현재 HTTP 적응 형 전송률 전달에 대한 노력이 있습니다. 대기업은 글로벌 전달을 위해 CDN 지원을 추가합니다.
• player : 맞춤 스트림, 자막, 광고, 채팅 모듈 등 다양한 옵션을 사용하여 실시간 스트림을 표시합니다. Flash는 지금까지 데스크탑에서 라이브 미디어 스트리밍을 위해 시장을 주도 해 왔습니다. HOS가 지원되는 iOS 및 Android 용 HTML5 동영상을 사용할 수 있습니다.

빠른 속도는 MPEG DASH이며 HTML5 비디오와 함께 작동합니다. 라이브를 지원하는 JS lib이 있습니다. 테스트를 거쳤으나 프로덕션 케이스 시나리오에 아직 사용하지는 못했지만 (아직은 지원이 잘 안됨) 약간의 clunky이고 브라우저 지원은 현재로서는 좁습니다 (8/30/13 현재). , 데스크톱 Chrome, 데스크톱 Internet Explorer 11 및 Android 용 모바일 Chrome 베타가 지원되는 유일한 브라우저입니다).

스트리밍을 위해 node.js를 사용하지 않았기 때문에 귀하의 솔루션에 대해 많은 의견을 말할 수는 없지만 흥미로운 노력처럼 들립니다. 귀하의 사례와 관련하여 사용하는 일반적인 해결책 :

디바이스> ffmpeg (H264/AAC)> Wowza> 하이브리드 플레이어 (Flash + HTML5).

Wowza 대신 Red5 (무료/오픈 소스 - 그러나 늦게까지 활동이 많지 않음)를 사용할 수 있습니다. 또한 RTMP 위에 HLS 및 MPEG DASH를 지원하는 Nginx RTMP module을 살펴볼 수 있습니다.

플래시의 경우 라이브 스트리밍을 지원하는 Adobe의 Strobe을 사용하며 설정이 쉽고 플래시가 지원되지 않는 HTML5로 폴백됩니다. 플래시 지원을 감지하고 휴대 기기 용 HTML5 동영상 태그에 HLS URL을 제공하기 위해 SWFObject lib를 사용합니다. Android < 4.1 및 기타 휴대 기기 용 RTSP를 사용할 수 있습니다.

내가 언급해야 할 또 하나의 사실은 실시간 통신입니다. 비디오/오디오 컨퍼런싱의 경우 WebRTC를 살펴볼 수 있습니다. 그 2 개의 기사는 올바른 길을 인도해야합니다. Here 및 here. WebRTC는 1 대 1, 1 대, 몇 대 몇 대를 위해 큰 효과를 발휘합니다. 더 많은 동시 연결을 지원해야하는 경우 Licode 또는 tokbox을 볼 수 있습니다.