150

Estou criando um aplicativo Web que deve reproduzir um fluxo RTSP / RTP a partir de um servidor ~~http://lscube.org/projects/feng~~ .

A tag de vídeo / áudio HTML5 suporta rtsp ou rtp? Caso contrário, qual seria a solução mais fácil? Talvez vá para um plugin VLC ou algo assim.

— Elben Shira
fonte

A tag de vídeo não "apenas funciona" com o RTSP. E o RTSP não é implementado nativamente por nenhum navegador que eu conheça. Você precisará de um plug-in, como você já descobriu. Ou use o webRTC, que é nativamente suportado pelo Chrome e Firefox, e você poderá usar a tag de vídeo com alguma lógica do webRTC. Se você estiver tentando transmitir a partir de uma fonte como uma câmera IP, use um serviço de streaming como o Wowza (ou escreva você mesmo) para transcodificar do RTSP para o webRTC. Este é o meu conselho para você.

— Michael P

Sugiro fazer esta pergunta no StackOverflow for Multimedia Systems

— Hamed

Eu acho que você pode obter fluxo com html5, mas você não pode transmitir para o algum lugar.

— precisa saber é o seguinte

Ótima pergunta, obrigado. "Acredito que não suportamos RTSP, apenas RTMP via videojs-flash". - esta é uma resposta do principal mantenedor do Video.js media player. Pesquiso o assunto e não consigo encontrar uma boa solução para ele.

— Zhibirc

É possível usar um WebRTC RTCPeerConnection para reproduzir um RTSP (ou mais corretamente o fluxo RTP que o RTSP configura) em um elemento de vídeo HTML. Anteriormente, havia uma demonstração em webrtc.live555.com . O truque será encontrar um servidor RTSP que tenha adicionado os emecanismos WebRTC DTLS e SRTP necessários.

— sipwiz 11/06

89

Tecnicamente 'Sim'

(mas não realmente...)

A <video>tag do HTML 5 é independente de protocolo - não importa. Você coloca o protocolo no srcatributo como parte da URL. Por exemplo:

<video src="rtp://myserver.com/path/to/stream">
    Your browser does not support the VIDEO tag and/or RTP streams.
</video>

ou talvez

<video src="http://myserver.com:1935/path/to/stream/myPlaylist.m3u8">
    Your browser does not support the VIDEO tag and/or RTP streams.
</video>

Dito isto, a implementação da <video>tag é específica do navegador. Como é cedo para o HTML 5, espero mudar frequentemente o suporte (ou falta de suporte).

Na especificação HTML5 do W3C ( o elemento de vídeo ):

Os agentes do usuário podem suportar qualquer codecs de vídeo e áudio e formatos de contêiner

— Stu Thompson
fonte

3

UPDATE : tentei o primeiro método no chrome e consegui GET rtp://239.255.0.1:6970 net::ERR_UNKNOWN_URL_SCHEME. Parece que apenas esquemas HTTP [S] são permitidos em videoelementos.

— 22715 Yan Foto

Certamente você nunca transferiria um vídeo por HTTP e usaria apenas protocolos como o RTP? Seria terrivelmente lento através de TCP ..

— markmnl

7

@markmnl Isso é sarcasmo? (Não sei dizer ... sou ingênuo assim.) O transporte HTTP é o método dominante de transferência de vídeo pela Web há alguns anos. Youtube, Netflix e outros. Não é uma questão de eficiência, mas sim a simplicidade, transversal firewall, simpatia cache do servidor, etc.

— Stu Thompson

Netflix transmite vídeo usando HTTP ?! Nenhum sarcasmo parece apenas uma maneira ineficiente de transmitir vídeo.

— markmnl

6

@markmnl Pelo bem da posteridade, vale a pena mencionar que a Netflix costumava transmitir com o MS Silverlight, mas abandonou-a há um tempo. Como alguém que está no streaming desde 2001, fiquei chocado ao ver o HTTP assumir o controle. Agora estou bebendo o Kool Aid. Nas redes corporativas, onde a eficiência é importante, os protocolos RTP criados sob medida são a norma, especialmente quando eles podem oferecer recursos como multicast.

— Stu Thompson

55

Acho que o espírito da pergunta não foi realmente respondido. Não, você não pode usar uma tag de vídeo para reproduzir fluxos rtsp a partir de agora. A outra resposta sobre o link para o "nunca" do Chromium é enganosa, pois o thread / resposta vinculado não se refere diretamente ao Chrome tocando rtsp por meio da tag de vídeo. Leia todo o tópico vinculado, especialmente os comentários na parte inferior e os links para outros tópicos.

A resposta real é esta: Não, você não pode simplesmente colocar uma tag de vídeo em uma página html 5 e reproduzir rtsp. Você precisa usar uma biblioteca Javascript de algum tipo (a menos que queira começar a jogar coisas com players flash e silverlight) para reproduzir vídeo streaming. {IMHO} Na velocidade da discussão e implementação do vídeo html 5, os vários fornecedores de padrões de vídeo proprietários não estão interessados em ajudar a avançar, por isso não conte com a facilidade prometida de uso da tag de vídeo, a menos que os fabricantes do navegador se encarregam de resolver de alguma forma o problema ... novamente, não é provável. {/ IMHO}

— GolfARama
fonte

1

Bom comentário Golf. Eu também queria fazer o que Elben está fazendo sem sucesso.

— will824

31

Esta é uma pergunta antiga, mas eu tive que fazer isso sozinho recentemente e consegui algo funcionando assim (além de respostas como a minha me pouparia algum tempo): Basicamente, use o ffmpeg para alterar o contêiner para HLS, a maioria do fluxo IPCams h264 e alguns tipo básico de PCM, use algo assim:

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

Em seguida, use o video.js com o plug-in HLS. Isso reproduzirá muito bem a transmissão ao vivo. Também há um exemplo do jsfiddle no segundo link).

Nota: embora este não seja um suporte nativo, não requer nada extra no frontend do usuário.

— Pawel K
fonte

Funcionou para mim, os Videojs que eu já estava usando e esse plug-in HLS faz o canal ao vivo com o arquivo m3u8 funcionar para a maioria dos URLs, se não todos.

— Dheeraj Thedijje

Ainda bem que ajudou, há um pouco mais de latência, mas que, ao que parece, não pode ser ajudado muito.

— Pawel K

1

Tente este @Cesar:

ffmpeg -v info -rtsp_transport tcp -i rtsp://host:port/[sdp] -c:v copy -c:a copy -maxrate 400k -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

— Pawel K

1

@Arter Basicamente, você precisa executar isso no seu servidor (a partir da linha de comando), como o Linux box ou algo remoto. Você precisa ter acesso à pasta / var / www / html / (neste exemplo) da perspectiva atual do usuário. Você também pode tentar fazê-lo no Windows com a ajuda de uma pilha LAMP ou o servidor Uniform (solução muito mais magro)

— Pawel K

1

Isso funcionou para mim. 'hls_wrap' foi descontinuado no ffmpeg mais recente. Eu usei esta linha de comando para qualquer pessoa interessada:

ffmpeg.exe -fflags nobuffer -rtsp_transport tcp -i rtsp://[SOURCE] -flags +cgop -g 30 -hls_flags delete_segments [DESTINATION]

— DanTheMan

19

O Chrome nunca implementará suporte ao streaming RTSP.

Pelo menos, nas palavras de um desenvolvedor de Chromium aqui :

nós nunca vamos adicionar suporte para isso

— janesconference
fonte

4

Bem, quase. Chrome já suporta RTSP streaming de, é por isso que ele nunca vai adicionar suporte para isso;)

— Stefan Steiger

2

Não, você não pode fazê-lo funcionar no chrome. Não está funcionando ao tentar com os links rtsp do youtube.

— IdidntKnewIt

18

Existem três protocolos / tecnologia de streaming em HTML5:

Transmissão ao vivo, baixa latência - WebRTC - Websocket

VOD e transmissão ao vivo, alta latência - HLS

1. WebRTC

De fato, o WebRTC é SRTP (protocolo RTP seguro). Assim, podemos dizer que a tag de vídeo suporta RTP (SRTP) indiretamente via WebRTC.

Portanto, para obter o fluxo RTP no seu Chrome, Firefox ou outro navegador HTML5, você precisa de um servidor WebRTC que entregue o fluxo SRTP ao navegador.

2. Websocket

É baseado em TCP, mas com menor latência que o HLS. Novamente, você precisa de um servidor Websocket.

3. HLS

Protocolo de streaming de alta latência mais popular para VOD (vídeo pré-gravado).

— ankitr
fonte

3

Como você reproduz um fluxo de áudio + vídeo ao vivo usando um soquete da Web? A única maneira de vídeo é usar o Broadway.js e isso é bastante hacky usando os fluxos h264 nal.

— marca Gamache

1

HLS significa HTTP Live Streaming. Gostaria de saber por que o HLS é amplamente usado para VOD, mas não para LOD.

— Shintaroid

1

Você não pode reproduzir um vídeo no navegador da Web a partir do WebSocket. Pelo menos não fora da caixa.

— Michael IV

-1, para soquete da Web ... mas não por todos os outros motivos pelos quais as pessoas estão dizendo. Você absolutamente pode reproduzir um vídeo recebendo os dados pelo websocket. Isso é trivial, com as Extensões do MediaSource. Você não deveria, porque você pode simplesmente usar o HTTP Progressive!

— Brad Brad

8

Com o VLC, sou capaz de transcodificar um fluxo RTSP ao vivo (mpeg4) para um fluxo HTTP no formato OGG (Vorbis / Theora). A qualidade é ruim, mas o vídeo funciona no Chrome 9. Também testei com um trancoding no WEBM (VP8), mas não parece funcionar (o VLC tem a opção, mas não sei se ele realmente foi implementado por enquanto. .)

O primeiro a ter um documento sobre isso deve nos notificar;)

— molokoloco
fonte

2

"C:\Program Files\VideoLAN\VLC\vlc.exe" -I dummy screen:// :screen-fps=16.000000 :screen-caching=100 :sout=#transcode{vcodec=theo,vb=800,scale=1,width=600,height=480,acodec=mp3}:http{mux=ogg,dst=127.0.0.1:8080/desktop.ogg} :no-sout-rtp-sap :no-sout-standard-sap :ttl=1 :sout-keep

- este é o comando VLC que flui a sua entrada (por exemplo, dispositivo de captura de tela) para um fluxo de dados de saída (por exemplo 127.0.0.1:8080/desktop.ogg )

— Zsolt

1

e então você pode incorporar isso em uma tag de vídeo: <video id="video" src="http://localhost:8080/desktop.ogg" autoplay="autoplay">.

— Zsolt

2

Infelizmente, o desempenho é muito ruim e seria ótimo se isso também pudesse ser feito com o contêiner MP4. Mais navegadores AFAIK têm suporte para MP4 do que para OGG.

— Zsolt

1

Também funcionou para mim. Eu configurei o VLC para transmitir áudio e vídeo via protocolo HTTP emmy_ip:port endereço e do que eu costumava HTML5 <video>tag como esta: <video width="640"><source src="http://my_ip:port/test" type="video/ogg">HTML5 not supported</video>.

— Patryk.beza

1

Minhas observações sobre a tag de vídeo HTML 5 e os fluxos rtsp (rtp) são que ele só funciona com o konqueror (KDE 4.4.1, Phonon-backend definido como GStreamer). Eu recebi apenas vídeo (sem áudio) com um fluxo H.264 / AAC RTSP (RTP).

Os fluxos de http://media.esof2010.org/ não funcionaram com o konqueror (KDE 4.4.1, Phonon-backend definido como GStreamer).

— Renegah
fonte

1

O Chrome não implementa suporte ao streaming RTSP. Um projeto importante para verificar o WebRTC.

"O WebRTC é um projeto aberto e gratuito que fornece aos navegadores e aplicativos móveis recursos de Comunicação em Tempo Real (RTC) por meio de APIs simples"

Navegadores suportados:

Chrome, Firefox e Opera.

Plataformas móveis suportadas:

Android e IOS

http://www.webrtc.org/

— vrbsm
fonte

Streaming via RTSP ou RTP em HTML5

Tecnicamente 'Sim'