Os usuários europeus da Internet estão divididos em duas partes: de acordo com uma pesquisa do Instituto de Análise de Opinião Pública de Allenbach (Alemanha), o Skype, o chat e os sistemas de mensagens instantâneas tornaram-se parte integrante da vida cotidiana de 16,5 milhões de adultos e crianças, 9 milhões usam esses serviços caso a caso, e 28 milhões não os tocam.

A situação pode mudar, já que agora o Firefox está integrado tecnologia de comunicação em tempo real (WebRTC), bem como o próprio cliente. Iniciar um bate-papo de áudio e vídeo agora não é mais difícil do que abrir um site. Serviços como Facebook e Skype, por outro lado, contam com soluções usando um cliente separado e criando uma conta.

O WebRTC não é apenas fácil de usar. Este método ainda permite que você defina conexão direta entre dois navegadores. Assim, os dados de áudio e vídeo não passam por um servidor onde possa ocorrer congestionamento ou onde o administrador não seja particularmente sensível sobre privacidade ou proteção de dados. Com uma conexão direta, o WebRTC não requer registro ou conta em nenhum serviço.

Para iniciar uma conversa, você só precisa seguir o link. A comunicação permanece privada porque o fluxo de dados é criptografado. Comunicação em tempo real através do navegador, o Google começou a se envolver ativamente em 2011, quando publicou o código-fonte de sua implementação WebRTC.

Pouco tempo depois, o Chrome e o Firefox receberam seus próprios mecanismos WebRTC. Atualmente, suas versões mobile estão equipadas tanto com essa tecnologia quanto com o motor WebView 3.6 instalado com Android 5.0, que é utilizado por aplicativos.

Para comunicação em tempo real, as interfaces JavaScript apropriadas devem ser implementadas no visualizador da web. Com GetUserMedia, o software permite a captura de fontes de áudio e vídeo, ou seja, webcam e microfone. O RTCPeerConnection é responsável por estabelecer a conexão, bem como pela própria comunicação.

Em paralelo com a integração do navegador, o grupo de trabalho do World Wide Web Consortium (W3C) vem impulsionando o processo de padronização do WebRTC. Deve ser concluído em 2015.

WebRTC se contenta com pouco

A utilização do serviço WebRTC não requer muitos recursos, pois o servidor apenas conecta os buddies. Estabelecer uma conexão também não é particularmente difícil. Primeiro, o navegador sinaliza ao servidor WebRTC que planeja iniciar uma chamada. Ele recebe um link HTTPS do servidor - a conexão é criptografada. O usuário envia este link para seu interlocutor. O navegador então pede permissão ao usuário para acessar a webcam e o microfone.

Para estabelecer uma conexão de streaming direta com a outra parte, o navegador recebe seu endereço IP e dados de configuração do serviço WebRTC. O navegador da web do amigo faz o mesmo.

Para que a conexão de streaming funcione sem problemas e com boa qualidade, três mecanismos funcionam no navegador. Dois deles otimizam e compactam dados de áudio e vídeo, o terceiro é responsável pelo seu transporte. Ele envia dados por protocolo SRTP(Secure Real-time Transport Protocol), que permite streaming criptografado em tempo real.

Se uma conexão direta falhar, o WebRTC procura outro caminho. Por exemplo, isso acontece quando as configurações de rede impedem que o servidor STUN possa relatar o endereço IP. O padrão WebRTC estipula que neste caso a conversa ocorrerá, mas com a inclusão intermediária do servidor TURN (Traversal Using Relays around NAT). Assim, no site netscan.co, você pode verificar se o WebRTC está implementado em seu computador e com seu acesso à Web.

Como é feita a ligação

Primeiro você precisa registrar uma conversa (1). O serviço WebRTC disponibiliza um link que precisa ser enviado ao interlocutor. O navegador, usando o STUNserver, descobre seu próprio endereço IP (2), envia para o serviço e recebe o IP do parceiro para estabelecer uma conexão direta (3). Se o STUN falhar, a conversação é redirecionada usando o TURNserver (4).

A comunicação usando a tecnologia WebRTC no navegador é iniciada usando o código JavaScript. Depois disso, três mecanismos são responsáveis ​​pela comunicação: os mecanismos de voz e vídeo coletam dados multimídia da webcam e do microfone, e o mecanismo de transporte combina as informações e envia o fluxo de forma criptografada usando o Secure Real-time Protocol (SRTP).

Quais navegadores funcionam com WebRTC

Chrome e Firefox estão equipados com um motor WebRTC que usa serviços como talky.io. O navegador Mozilla pode trabalhar diretamente com seu próprio cliente.

Google e Mozilla continuam a desenvolver a ideia de comunicação em tempo real: o Chrome pode hospedar uma conferência WebRTC com vários participantes, e o novo cliente Hello no Firefox é desenvolvido com a ajuda de uma subsidiária da gigante das telecomunicações Telefonica. A Apple permanece à margem por enquanto, você não deve esperar o WebRTC no Safari ainda. No entanto, existem muitos aplicativos e plugins iOS alternativos para o Safari.

A Microsoft está tomando um rumo um pouco diferente. Como proprietária do competitivo serviço Skype, esta empresa não vai capitular ao WebRTC tão facilmente. Em vez disso, a Microsoft está desenvolvendo uma tecnologia chamada ORTC (Object Real-Time Communications) para o Internet Explorer.

As diferenças do WebRTC, como codecs e protocolos diferentes para estabelecer contato com o servidor, são pequenas e, com o tempo, provavelmente se tornarão adicionais ao padrão WebRTC, que incluirá essas diferenças. Assim, apenas a Apple fica para trás - como de costume.

Uma foto: companhias de manutafuramento; goodluz/Photolia.com

WebRTC(Web Real-Time Communications) é uma tecnologia que permite que aplicativos e sites da Web capturem e transmitam seletivamente fluxos de mídia de áudio e/ou vídeo, bem como troquem dados arbitrários entre navegadores, sem a necessidade de intermediários. O conjunto de padrões que a tecnologia WebRTC inclui permite a troca de dados e a teleconferência ponto a ponto sem que o usuário precise instalar plug-ins ou qualquer outro software de terceiros.

O WebRTC consiste em várias interfaces de programação (APIs) inter-relacionadas e protocolos que funcionam juntos. A documentação que você encontrará aqui o ajudará a entender os fundamentos do WebRTC, como configurar e usar uma conexão de dados e mídia e muito mais.

Compatibilidade

Como as implementações do WebRTC estão em desenvolvimento e todos os navegadores têm a funcionalidade WebRTC, é altamente recomendável que você use a biblioteca polyfill Adapter.js do Google antes de começar a trabalhar em seu código.

O Adapter.js usa wedges e polyfills para unir diferenças nas implementações de WebRTC entre contextos que o suportam. O Adapter.js também lida com prefixos de fornecedores e outras diferenças de nomenclatura de propriedades, facilitando o processo de desenvolvimento WebRTC com o resultado mais consistente. A biblioteca também está disponível como um pacote NPM.

Para explorar mais a biblioteca Adapter.js, consulte .

Conceitos e uso do WebRTC

O WebRTC é versátil e, junto com o , fornece recursos multimídia poderosos para a Web, incluindo suporte para conferência de áudio e vídeo, compartilhamento de arquivos, captura de tela, gerenciamento de identidade e interoperabilidade com sistemas telefônicos legados, incluindo suporte para discagem por tom DTMF. As conexões entre os nós podem ser criadas sem o uso de drivers ou plug-ins especiais e, muitas vezes, sem serviços intermediários.

A conexão entre dois nós é representada como um objeto da interface RTCPeerConnection. Uma vez que uma conexão é estabelecida e aberta usando um objeto RTCPeerConnection, fluxos de mídia ( MediaStream s) e/ou canais de dados ( RTCDataChannel s) podem ser adicionados à conexão.

Os fluxos de mídia podem consistir em qualquer número de faixas (faixas) de informações de mídia. Essas faixas, representadas por objetos da interface MediaStreamTrack, podem conter um ou mais tipos de mídia, incluindo áudio, vídeo, texto (como legendas ou títulos de capítulos). A maioria dos fluxos consiste em pelo menos uma faixa de áudio (uma faixa de áudio) ou faixa de vídeo e pode ser enviada e recebida como fluxos (mídia em tempo real) ou salva em um arquivo.

Além disso, você pode usar a conexão entre dois nós para trocar dados arbitrários usando o objeto de interface RTCDataChannel, que pode ser usado para transferir informações de serviço, dados de estoque, pacotes de status de jogos, arquivos de transferência ou canais privados de transferência de dados.

mais detalhes e links para guias e tutoriais relevantes necessários

Interfaces WebRTC

Devido ao fato de o WebRTC fornecer interfaces que trabalham em conjunto para realizar diversas tarefas, nós as dividimos em categorias. Consulte o índice alfabético da barra lateral para navegação rápida.

Configuração e gerenciamento de conexão

Essas interfaces são usadas para configurar, abrir e gerenciar conexões WebRTC. Eles representam conexões de mídia ponto a ponto, canais de dados e interfaces usadas para trocar informações sobre as capacidades de cada nó para selecionar a melhor configuração ao estabelecer uma conexão multimídia bidirecional.

RTCPeerConnection Representa uma conexão WebRTC entre o computador local e um host remoto. Usado para lidar com a transferência de dados bem-sucedida entre dois nós. RTCSessionDescription Representa os parâmetros da sessão. Cada RTCSessionDescription contém descrições de tipo indicando qual parte (oferta/resposta) do processo de negociação ele descreve e um descritor de sessão SDP. RTCIceCandidate Representa o candidato a servidor de estabelecimento de conexão com a Internet (ICE) para estabelecer uma conexão RTCPeerConnection. RTCIceTransport Representa informações sobre o Internet Connectivity Facility (ICE). RTCPeerConnectionIceEvent Representa eventos que ocorrem em candidatos ICE, normalmente RTCPeerConnection . Um tipo é passado para este objeto de evento: icecandidate . RTCRtpSender Controla a codificação e transmissão de dados por meio de um objeto do tipo MediaStreamTrack para um objeto do tipo RTCPeerConnection . RTCRtpReceiver Controla o recebimento e a decodificação de dados por meio de um objeto do tipo MediaStreamTrack para um objeto do tipo RTCPeerConnection . RTCTrackEvent Indica que um novo objeto de entrada do tipo MediaStreamTrack foi criado e um objeto do tipo RTCRtpReceiver foi adicionado ao objeto RTCPeerConnection. RTCCertificate Representa o certificado que o objeto RTCPeerConnection usa. RTCDataChannel Representa um canal de dados bidirecional entre dois nós de conexão. RTCDataChannelEvent Representa eventos que são gerados quando um objeto do tipo RTCDataChannel é anexado a um objeto do tipo RTCPeerConnection datachannel . RTCDTMFSender Controla a codificação e a transmissão da sinalização DTMF (Dual Tone Multi-Frequency) para um objeto do tipo RTCPeerConnection . RTCDTMFToneChangeEvent Indica um evento de mudança de tom DTMF de entrada. Este evento não bolha (a menos que especificado de outra forma) e não é cancelável (a menos que especificado de outra forma). RTCStatsReport Informa o status de forma assíncrona para o objeto passado do tipo MediaStreamTrack . RTCIdentityProviderRegistrar Registra um provedor de identidade (idP). RTCIdentityProvider Permite que o navegador solicite a criação ou validação de uma declaração de identidade. RTCIdentityAssertion Representa a ID do host remoto da conexão atual. Se o nó ainda não foi instalado e confirmado, a referência da interface retornará null . Não muda após a instalação. RTCIdentityEvent Representa uma declaração de provedor de identidade (idP) de um objeto de evento identificador. Evento de um objeto do tipo RTCPeerConnection . Um tipo é passado para este evento identityresult. RTCIdentityErrorEvent Representa um objeto de evento de erro associado ao provedor de identidade (idP). Evento de um objeto do tipo RTCPeerConnection . Dois tipos de erro são passados ​​para este evento: idpassertionerror e idpvalidationerror .

Guias

Visão geral da arquitetura WebRTC Abaixo da API que os desenvolvedores usam para criar e usar o WebRTC está um conjunto de protocolos de rede e padrões de conexão. Esta revisão é uma vitrine desses padrões. O WebRTC permite que você configure uma conexão nó a nó para transferir dados arbitrários, áudio, fluxos de vídeo ou qualquer combinação deles no navegador. Neste artigo, vamos dar uma olhada na vida de uma sessão WebRTC, desde o estabelecimento de uma conexão até o fim dela quando ela não for mais necessária. Visão geral do WebRTC A API do WebRTC consiste em várias APIs e protocolos inter-relacionados que trabalham juntos para fornecer suporte para a troca de dados e fluxos de mídia entre dois ou mais nós. Este artigo fornece uma breve visão geral de cada uma dessas APIs e sua finalidade. Noções básicas de WebRTC Este artigo orientará você na criação de um aplicativo RTC entre navegadores. No final deste artigo, você deve ter um canal de mídia e dados funcionando ponto a ponto. Protocolos WebRTC Este artigo apresenta os protocolos para os quais a API WebRTC foi criada. Este guia descreve como você pode usar uma conexão nó a nó e um link

Hoje, WebRTC é a tecnologia "quente" para streaming de áudio e vídeo em navegadores. Tecnologias conservadoras, como HTTP Streaming e Flash, são mais adequadas para distribuição de conteúdo gravado (vídeo sob demanda) e são significativamente inferiores ao WebRTC em termos de transmissões em tempo real e online, ou seja, onde a latência mínima de vídeo é necessária, permitindo que os espectadores vejam o que está acontecendo "ao vivo".

A possibilidade de comunicação em tempo real de alta qualidade vem da própria arquitetura WebRTC, onde o protocolo UDP é usado para transportar streams de vídeo, que é a base padrão para transmissão de vídeo com atrasos mínimos e é amplamente utilizado em sistemas de comunicação em tempo real.

A latência de comunicação é importante em sistemas de transmissão ao vivo, webinars e outros aplicativos em que a comunicação interativa com a fonte de vídeo, os usuários finais e a solução é necessária.

Outra boa razão para experimentar o WebRTC é definitivamente uma tendência. Hoje, todos os navegadores Android Chrome suportam essa tecnologia, o que garante que milhões de dispositivos estejam prontos para assistir à transmissão sem instalar nenhum software e configurações adicionais.

Para testar a tecnologia WebRTC em ação e lançar uma transmissão online simples nela, usamos o software de servidor Flashphoner WebRTC Media & Broadcasting Server. Os recursos declaram a capacidade de transmitir fluxos WebRTC no modo um para muitos, bem como suporte para câmeras IP e sistemas de vigilância por vídeo através do protocolo RTSP; nesta revisão, vamos nos concentrar nas transmissões web-web e seus recursos.

Instalando o Servidor de Mídia e Transmissão WebRTC

Como não havia versão de servidor para o sistema Windows e eu não queria instalar uma máquina virtual como VMWare + Linux, não pude testar transmissões online em meu computador Windows doméstico. Para economizar tempo, decidimos fazer uma instância de hospedagem na nuvem assim:

Era um Centos x86_64 versão 6.5 sem nenhum software pré-instalado em um data center de Amsterdã. Assim, tudo o que temos à nossa disposição é um servidor e acesso ssh a ele. Para quem está familiarizado com os comandos do console Linux, instalar um servidor WebRTC promete ser fácil e indolor. Então o que fizemos:

1. Baixar arquivo:

$wget https://website/download-wcs5-server.tar.gz

2. Descompacte:

$tar -xzf download-wcs5-server.tar.gz

3. Instalar:

$cd FlashphonerWebCallServer

Durante a instalação, digite o endereço IP do servidor: XXX.XXX.XXX.XXX

4. Ativar licença:

$cd /usr/local/FlashphonerWebCallServer/bin

$./activation.sh

5. Inicie o servidor WCS:

$service webcallserver start

6. Verifique o registro:

$tail - f /usr/local/FlashphonerWebCallServer/logs/flashphoner_manager.log

7. Verifique se dois processos estão em vigor:

$ps aux | grep Flashphoner

O processo de instalação está concluído.

Testando transmissões ao vivo do WebRTC

Testar transmissões acabou sendo uma questão simples. Além do servidor, existe um cliente web, que consiste em uma dúzia de arquivos Javascript, HTML e CSS e foi implantado por nós na pasta /var/www/html durante a fase de instalação. A única coisa que precisava ser feita era inserir o endereço IP do servidor na configuração flashphoner.xml para que o cliente da Web pudesse estabelecer uma conexão com o servidor via Websockets HTML5. Vamos descrever o processo de teste.

1. Abra a página index.html do cliente de teste no navegador Chrome:

2. Para iniciar a transmissão, você precisa clicar no botão "Iniciar" no meio da tela.
Antes de fazer isso, você precisa ter certeza de que a webcam está conectada e pronta para uso. Não há requisitos especiais para uma webcam, por exemplo, usamos uma câmera de laptop embutida padrão com resolução de 1280 × 800.

O navegador Chrome definitivamente pedirá acesso à câmera e ao microfone para que o usuário entenda que seu vídeo será enviado para o servidor da Internet e permita que ele o faça.

3. A interface representa uma transmissão bem-sucedida do fluxo de vídeo da câmera para o servidor WebRTC. No canto superior direito, o indicador indica que o fluxo está indo para o servidor, no canto inferior há um botão "Parar" para interromper o envio do vídeo.

Dê uma olhada no link abaixo. Ele contém um identificador exclusivo para este fluxo, para que qualquer pessoa possa participar da visualização. Basta abrir este link em um navegador. Para copiá-lo para a área de transferência, você precisa clicar no botão "Copiar".

Em aplicações reais como webinars, palestras, transmissões de vídeo online ou TV interativa, os desenvolvedores terão que implementar a distribuição desse identificador para determinados grupos de espectadores para que possam se conectar aos streams desejados, mas essa é a lógica do aplicativo. Servidor de mídia e transmissão WebRTC não afeta, mas trata apenas da distribuição de vídeo.

5. A conexão é estabelecida e o espectador vê o fluxo na tela. Agora ele pode enviar o link para outra pessoa, interromper a reprodução do stream ou ativar o modo de tela cheia usando os controles no canto inferior direito.

Resultados de teste do servidor WebRTC para transmissões online

Durante os testes, a latência parecia perfeita. O ping para o data center foi de cerca de 100 milissegundos e o atraso não era visível a olho nu. A partir daqui, podemos supor que o atraso real é o mesmo 100 mais ou menos algumas dezenas de milissegundos para o tempo de buffer. Comparado ao vídeo em Flash, o Flash não tem um desempenho tão bom quanto o WebRTC nesses testes. Portanto, se você mover a mão em uma rede semelhante, o movimento na tela poderá ser visto apenas após um / dois segundos.

Em relação à qualidade, notamos que às vezes você pode distinguir cubos em movimentos. Isso está de acordo com a natureza do codec VP8 e seu principal objetivo é fornecer comunicação de vídeo em tempo real com qualidade aceitável e sem atrasos de comunicação.

O servidor é bastante fácil de instalar e configurar, não requer nenhuma habilidade séria para executá-lo, exceto o conhecimento de Linux no nível de um usuário avançado que pode executar comandos do console via ssh e usar um editor de texto. Como resultado, conseguimos configurar uma transmissão online um-para-muitos entre navegadores. A conexão de espectadores adicionais ao fluxo também não causou problemas.

A qualidade da transmissão acabou sendo bastante aceitável para webinars e transmissões online. A única coisa que causou algumas dúvidas foi a resolução do vídeo. A câmera suporta 1280x800, mas a resolução na imagem de teste é muito semelhante a 640x480. Aparentemente, essa questão precisa ser esclarecida com os desenvolvedores.

Vídeo sobre como testar a transmissão de uma webcam
via servidor WebRTC

O objetivo deste artigo é familiarizar-se com sua estrutura e princípio de operação em uma amostra de demonstração de um bate-papo por vídeo ponto a ponto (bate-papo por vídeo p2p). Para isso, usaremos a demonstração de bate-papo por vídeo ponto a ponto multiusuário webrtc.io-demo. Ele pode ser baixado no link: https://github.com/webRTC/webrtc.io-demo/tree/master/site .

Cabe ressaltar que o GitHub é um site ou serviço web para desenvolvimento colaborativo de projetos web. Nele, os desenvolvedores podem postar códigos de seus desenvolvimentos, discuti-los e comunicar-se entre si. Além disso, algumas grandes empresas de TI hospedam seus repositórios oficiais neste site. O serviço é gratuito para projetos de código aberto. GitHub é um repositório de bibliotecas de código aberto.

Assim, baixamos do GitHub uma amostra de demonstração de um vídeo chat peer-to-peer, vamos colocá-lo na unidade C de um computador pessoal no diretório criado para nosso aplicativo "webrtc_demo".

Arroz. 1

Como segue da estrutura (Fig. 1), um bate-papo de vídeo ponto a ponto consiste em scripts cliente script.js e servidor server.js implementados na linguagem de programação JavaScript. Script (biblioteca) webrtc.io.js (CLIENT) - fornece a organização de comunicações em tempo real entre navegadores de acordo com um esquema peer-to-peer: "client-client", e webrtc.io.js (CLIENT) e webrtc .io.js (SERVER), usando o protocolo WebSocket, fornecem comunicação duplex entre o navegador e o servidor web usando a arquitetura "cliente-servidor".

O script webrtc.io.js (SERVER) está incluído na biblioteca webrtc.io e está localizado no diretório node_modules\webrtc.io\lib. A interface de bate-papo por vídeo index.html é implementada em HTML5 e CSS3. O conteúdo dos arquivos do aplicativo webrtc_demo pode ser visualizado com um dos editores html, por exemplo "Notepad++".

Verificaremos o princípio do bate-papo por vídeo no sistema de arquivos do PC. Para executar o servidor (server.js) em um PC, você precisa instalar o runtime node.js. O Node.js permite que você execute o código JavaScript fora do navegador. Você pode baixar o node.js no link: http://nodejs.org/ (versão v0.10.13 em 15/07/13). Na página principal do site node.org, clique no botão de download e vá para http://nodejs.org/download/. Para usuários do Windows, primeiro baixe o win.installer (.msi), depois execute o win.installer (.msi) no PC e instale o nodejs e o "npm package manager" no diretório Program Files.

Arroz. 2

Assim, o node.js consiste em um ambiente de desenvolvimento e execução JavaScript, além de um conjunto de módulos internos que podem ser instalados usando o gerenciador de pacotes npm ou gerenciador de pacotes.

Para instalar módulos, execute o seguinte comando na linha de comando do diretório do aplicativo (por exemplo, "webrtc_demo"): npm install module_name. Durante a instalação dos módulos, o gerenciador npm cria uma pasta node_modules no diretório a partir do qual a instalação foi realizada. À medida que é executado, o nodejs inclui automaticamente módulos do diretório node_modules.

Assim, após instalar o node.js, abra a linha de comando e atualize o módulo express na pasta node_modules do diretório webrtc_demo usando o gerenciador de pacotes npm:

C:\webrtc_demo>npm install express

O módulo express é um framework web para node.js ou plataforma de desenvolvimento de aplicativos web. Para ter acesso global ao express, você pode instalá-lo assim: npm install -g express.

Em seguida, atualizamos o módulo webrtc.io:

C:\webrtc_demo>npm install webrtc.io

Então, na linha de comando, iniciamos o servidor: server.js:

C:\webrtc_demo>nodeserver.js

Arroz. 3

Tudo, o servidor está funcionando com sucesso (Figura 3). Agora, usando um navegador da Web, você pode entrar em contato com o servidor por endereço IP e baixar a página da Web index.html, da qual o navegador da Web extrairá o código do script do cliente - script.js e o código do script webrtc.io.js, e executá-los. Para que um chat de vídeo peer-to-peer funcione (para estabelecer uma conexão entre dois navegadores), é necessário que dois navegadores que suportem webrtc entrem em contato com o servidor de sinal em execução no node.js pelo endereço IP.

Como resultado, a interface da parte cliente do aplicativo de comunicação (chat de vídeo) será aberta com uma solicitação de permissão para acessar a câmera e o microfone (Fig. 4).

Arroz. quatro

Após clicar no botão "Permitir", a câmera e o microfone são conectados para comunicação multimídia. Além disso, através da interface de bate-papo por vídeo, você pode se comunicar com dados de texto (Fig. 5).

Arroz. 5

Deve-se notar que . O servidor está sinalizando e é projetado principalmente para estabelecer uma conexão entre os navegadores dos usuários. O script server.js que fornece sinalização WebRTC usa Node.js para ser executado.