JavaScript

Testando seu código em um navegador

Neste momento, o seu app.js O arquivo deve ficar mais ou menos assim (com alguns ajustes):

// replace these values with those generated in your Video API account
var applicationId = "YOUR_APP_ID";
var sessionId = "YOUR_SESSION_ID";
var token = "YOUR_TOKEN";

initializeSession();

// Handling all of our errors here by alerting them
function handleError(error) {
  if (error) {
    alert(error.message);
  }
}

function initializeSession() {
  const session = OT.initSession(applicationId, sessionId);

  // Subscribe to a newly created stream
  session.on('streamCreated', function(event) {
    session.subscribe(event.stream, 'subscriber', {
      insertMode: 'append',
      width: '100%',
      height: '100%'
    }, handleError);
  });

  // Create a publisher
  const publisher = OT.initPublisher('publisher', {
    insertMode: 'append',
    width: '100%',
    height: '100%'
  }, handleError);

  // Connect to the session
  session.connect(token, function(error) {
    // If the connection is successful, publish to the session
    if (error) {
      handleError(error);
    } else {
      session.publish(publisher, handleError);
    }
  });
}

No seu código finalizado, você deve ter valores fixos para substituir YOUR_APP_ID, YOUR_SESSION_ID e YOUR_TOKEN — se você ainda não fez isso, consulte Configurando a autenticação acima.

  1. Abra o index.html abra o arquivo no seu navegador clicando duas vezes nele.
  2. O navegador solicitará permissão para usar sua câmera e seu microfone; vá em frente e conceda o acesso.
  3. Você deve se ver aparecer na tela.

A seguir, podemos testar como fica quando outra pessoa se conecta. Embora nosso código não esteja acessível pela internet, podemos simular isso abrindo esta página em outra janela.

  1. Desative o microfone para evitar qualquer eco.
  2. Copie a URL da barra de endereços do seu navegador.
  3. Abra uma nova janela ou aba e cole o endereço para abrir o arquivo.
  4. Agora você deve se ver duas vezes (com uma imagem espelhada da outra, dependendo do seu navegador).

Dica para solução de problemas: Se nenhum vídeo estiver sendo exibido na página, abra a aba “console” nas ferramentas do seu navegador (command+option+i no Mac, CTRL+i no Windows) e verifique se há erros. O problema mais provável é que sua chave de API, ID de sessão ou token não esteja configurado corretamente. Como você inseriu suas credenciais diretamente no código, também é possível que seu token tenha expirado.