Tutorial sobre arquivamento (Web)

Visão geral

A API de arquivamento da OpenTok permite gravar os fluxos de áudio e vídeo de uma sessão em arquivos MP4.

Configurando o servidor

Para arquivar sessões do OpenTok, é necessário ter um servidor Configuração. Existem várias maneiras de implementar o arquivamento com um servidor, mas, para este tutorial, vamos configurar rapidamente um servidor PHP simples.

Para iniciar o servidor, basta clicar no botão do Heroku abaixo; em seguida, você será redirecionado ao site do Heroku e solicitado a inserir sua chave de API e seu segredo de API do OpenTok — você pode obter esses valores na página do seu projeto em seu Account da Video API. Se você não tiver um Account no Heroku, precisará se cadastrar (é grátis).

Deploy

Quer dar uma olhada no código? O botão acima executa o código do servidor a partir do aprendendo-opentok-php Repositório do GitHub. Acesse o repositório para revisar o código e consultar a documentação adicional — você pode até mesmo criar um fork do repositório e fazer alterações antes da implantação.

Configurando seu projeto

Para acompanhar este tutorial, clone o repositório do OpenTok Aplicativos de exemplo na Web repositório no GitHub:

git clone https://github.com/Vonage-Community/video-api-web-samples.git

Em seguida, abra o Arquivamento pasta no seu editor de código para acompanhar o passo a passo.

Importante: Você só pode arquivar sessões que utilizam o Roteador de mídia OpenTok (sessões com o modo de mídia configurado como “roteado”). O padrão aprendendo-opentok-php O código utilizado por este aplicativo tutorial utiliza sessões roteadas.

Explorando o código

Você usa código do lado do servidor para iniciar e interromper gravações de arquivo. No arquivo config.js, você define o SAMPLE_SERVER_BASE_URL variável à URL base do serviço web que o aplicativo chama para iniciar a gravação do arquivo, interromper a gravação e reproduzir o vídeo gravado. Certifique-se de que não haja nenhum caractere adicional no final / no final do domínio.

O aplicativo de arquivamento utiliza o mesmo código disponível na pasta “Basic Video Chat” para inicializar uma sessão do OpenTok, conectar-se à sessão, publicar um stream e assinar o stream na sessão. Se você ainda não se familiarizou com o código nesse branch, considere dar uma olhada no Tutorial básico do cliente para a web antes de continuar.

Para iniciar a gravação do fluxo de vídeo, o usuário clica no botão “Iniciar Gravação”, o que invoca o método startArchive() no arquivo app.js. Esse método, por sua vez, envia uma solicitação XHR (ou Ajax) ao servidor. O ID da sessão que precisa ser gravada é passado no formato JSON para o servidor. Assim que o método startArchive() é chamado, o botão “Iniciar gravação” é ocultado e o botão “Parar gravação” é exibido.


function startArchive() {
  $.ajax({
    url: SAMPLE_SERVER_BASE_URL + '/archive/start',
    type: "POST",
    contentType: "application/json", // send as JSON
    data: JSON.stringify({"sessionId": sessionId}),

    complete: function() {
      //called when complete
      console.log('startArchive() complete');
    },

    success: function() {
      //called when successful
      console.log('successfully called startArchive()');
    },

    error: function() {
      //called when there is an error
      console.log('error calling startArchive()');
    },
  });

  $('#start').hide();
  $('#stop').show();
}

Para interromper a gravação, o usuário clica no botão “Interromper gravação”, o que invoca o método stopArchive(). Esse método é semelhante ao método startArchive(), pois envia uma solicitação Ajax ao servidor para interromper o arquivo. A única diferença é que esse método passa o ID do arquivo que precisa ser interrompido como um parâmetro de URL, em vez do sessionId. O botão “Parar gravação” fica oculto e o botão “Visualizar arquivo” é ativado.

function stopArchive() {
  $.post(SAMPLE_SERVER_BASE_URL + '/archive/' + archiveID + '/stop');
  $('#stop').hide();
  $('#view').prop('disabled', false);
  $('#stop').show();
}

Para baixar o arquivo que acabou de ser gravado, o usuário clica no botão “Exibir Arquivo”, o que invoca o método viewArchive(). Esse método é semelhante aos métodos startArchive() e stopArchive(), pois envia uma solicitação Ajax ao servidor. O código do servidor possui a lógica para verificar se o arquivo está disponível para download ou não. Se estiver disponível, o aplicativo é redirecionado para a página do arquivo. Caso contrário, é carregada uma nova página que verifica continuamente se o arquivo está disponível para download e o carrega assim que estiver disponível.

Notas:

  • Na maioria das aplicações, o controle sobre o registro de arquivo não seria concedido a cada usuário final.

  • É possível ter sessões arquivadas automaticamente, que são gravadas sempre que um cliente começa a transmitir um stream.

  • É recomendável configurar um destino no Amazon S3 ou no Microsoft Azure para armazenar suas gravações de arquivo.

Para obter mais informações sobre arquivamento, consulte o Guia do desenvolvedor sobre arquivamento do OpenTok.

Parabéns! Você concluiu o Tutorial de Arquivamento para a Web.
Você pode continuar experimentando e ajustando o código que desenvolveu aqui, ou conferir o Próximos passos abaixo.

Próximos passos

Quando terminar esta seção, continue desenvolvendo e aprimorando seu aplicativo OpenTok com estes recursos úteis: