Como incorporar uma transmissão no seu site

Por que o RTSP não funciona no navegador

O RTSP foi projetado para controlar a transmissão de vídeo, mas os navegadores modernos não conseguem reproduzir o protocolo diretamente. Se você colar um link RTSP no HTML ou abri-lo como um endereço comum, nenhum vídeo aparecerá na página.

Para exibi-la na web, a transmissão precisa ser recebida, preparada em um formato compatível e entregue ao espectador por meio de um player web. É exatamente isso que o rtsp.me faz.

O que você recebe

• Código prontoCódigo HTML do player para inserir em uma página
• Adaptação da transmissãoReprodução em navegadores web modernos
• Dispositivos móveisVisualização otimizada para celulares e tablets
• EstatísticasAcesso do proprietário às estatísticas de visitas da transmissão

Você não precisará criar um player próprio nem manter um sistema separado de conversão de vídeo.

Etapa 1. Prepare a transmissão

Primeiro, adicione a câmera IP no rtsp.me e aguarde o vídeo começar a funcionar corretamente. Se a câmera ainda não estiver conectada, siga o guia “Como criar uma transmissão ao vivo em um site”.

1. Abra o rtsp.me e faça login na sua conta.
2. Selecione a câmera que você conectou.
3. Certifique-se de que a imagem esteja disponível e que a transmissão funcione de forma estável.
4. Abra as configurações de incorporação ou o código do player.

Etapa 2. Obtenha o código HTML

O rtsp.me gera um trecho de HTML pronto para a transmissão selecionada. Copie-o por completo, sem alterar o endereço do player nem os parâmetros do serviço.

O código funciona em um site HTML simples, em um template de CMS ou em um bloco de HTML personalizado de um construtor de sites, desde que a plataforma permita a incorporação de players externos.

Exemplo de código HTML

<iframe
  src="https://rtsp.me/embed/WKZb7jUsUw5T9N4f/"
  style="width:100%; aspect-ratio:4/3; border:0;"
  title="RTSP streaming player"
  allow="fullscreen; autoplay"
  allowfullscreen>
  Iframes not supported. Stream <a href="https://rtsp.me/"
    title="rtsp video streaming service">rtsp.me</a> player
</iframe>

O código real da sua transmissão conterá o endereço da sua própria transmissão. Não o substitua pelo identificador de demonstração WKZb7jUsUw5T9N4f.

Como fica o player incorporado

Etapa 3. Insira o código

1. Abra a página em que a transmissão deve aparecer.
2. Mude para o modo de edição de HTML ou adicione um bloco para código incorporado.
3. Cole o código do player onde for necessário.
4. Salve e publique a página.
5. Verifique se o vídeo é reproduzido no navegador, tanto no computador quanto no celular.

Assim que a página publicada é carregada, o player se conecta ao rtsp.me e começa a reproduzir a transmissão disponível.

Navegadores e dispositivos móveis

O rtsp.me otimiza a transmissão de origem não apenas para navegadores de desktop, mas também para dispositivos móveis. O visitante não precisa instalar nenhum software de visualização RTSP nem inserir credenciais da câmera.

O player responsivo pode ficar dentro de um contêiner da página, de modo que sua largura se adapte à tela. Após a publicação, verifique a página nas orientações retrato e paisagem em um celular, e também em uma conexão móvel lenta.

A qualidade da visualização também depende das configurações da câmera e da velocidade de upload disponível no local. As recomendações estão na página “Configurações recomendadas para câmeras IP”.

Estatísticas de visitas

O proprietário da transmissão tem acesso às estatísticas de visitas. Elas ajudam a avaliar o interesse do público e acompanhar como o player é usado no site.

As estatísticas estão disponíveis na interface do rtsp.me. As métricas exibidas podem depender das configurações da transmissão e do plano utilizado.

Integração segura via PHP

O código HTML simples é adequado para uma transmissão pública. Se o vídeo deve ser destinado apenas a clientes registrados, funcionários ou consumidores, o player pode ser conectado por meio de código PHP no lado do servidor.

Nessa configuração, o seu servidor primeiro verifica as permissões do usuário e, em seguida, gera um link exclusivo do player para ele. O link é criado separadamente para cada visitante e não fica armazenado permanentemente no HTML público da página.

1. O usuário faz login na conta dele no seu site.
2. O código PHP verifica se a visualização é permitida para ele.
3. O servidor gera um link pessoal usando os parâmetros de integração do rtsp.me.
4. A página passa o link para o player apenas para esse usuário.

Uma comparação da integração via PHP com domínios permitidos, senha, bloqueio de IP e acesso baseado em conta está no guia “Como proteger uma transmissão contra cópia”.

Perguntas frequentes