Probar tu código en un navegador
Llegados a este punto, tu app.js debería tener este aspecto (con algunos 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);
}
});
}
En el código completado, debería haber valores codificados para sustituir a YOUR_APP_ID, YOUR_SESSION_ID y YOUR_TOKEN - si no lo ha hecho, consulte Configuración de la autenticación arriba.
- Abra el
index.htmlen su navegador haciendo doble clic sobre él. - El navegador te pedirá permiso para utilizar la cámara y el micrófono; adelante, concédele el acceso.
- Deberías verte aparecer en la pantalla.
A continuación, podemos comprobar qué ocurre si se conecta otra persona. Aunque no se puede acceder a nuestro código desde Internet, podemos simularlo abriendo esta página en otra ventana.
- Silénciate para evitar cualquier retroalimentación.
- Copia la URL que aparece en la barra de direcciones de tu navegador.
- Abre una nueva ventana o pestaña y pega la dirección para abrir el archivo.
- Ahora deberías verte dos veces (con una imagen reflejada de la otra, dependiendo de tu navegador).
Consejo para solucionar problemas: Si no aparece ningún vídeo en la página, abre la pestaña "consola" en las herramientas de tu navegador (command+option+i en Mac, CTRL+i en Windows) y comprueba si hay errores. Lo más probable es que tu clave API, ID de sesión o token no estén configurados correctamente. Dado que codificaste tus credenciales, también es posible que tu token haya caducado.
Videochat básico
Aprende los conceptos básicos de la plataforma Vonage Video API, incluyendo cómo los usuarios pueden comunicarse a través de vídeo, voz y mensajería. Explora un flujo básico de la Video API de Vonage.