Embeber Zoom en Vuejs

Recientemente me he visto involucrado en un proyecto en el cual he tenido que trabajar por primera vez con Zoom. Una de las funcionalidades peor documentadas y con más limitaciones de Zoom es la integración, en este caso Embeber Zoom en Vuejs, es decir, hacer que un Meeting de Zoom pueda ser seguido desde tu sitio en lugar de utilizar su APP.

Ya que es algo que me ha llevado bastante trabajo quiero compartir una guía para poder hacer esta integración con el consiguiente resultado:

Instalar el SDK de Zoom

Lo primero que debemos hacer es instalar el SDK de Zoom, esta es la herramienta que nos permitirá hacer la integración:

Inicializar la configuración de Zoom en Vuejs

Ahora crea un archivo zoom.client.js para inicializar la configuración necesaria y crear dos EventBus con Vuejs.

Crear el componente Zoom con Vuejs

Para finalizar nuestro trabajo simplemente nos queda crear un componente con Vuejs para poder mostrar los meetings de Zoom en nuestro sitio web, eso lo podemos conseguir con el siguiente componente:

Mostrar Zoom en nuestra web

El último paso es utilizar nuestro nuevo componente Zoom, eso lo podemos conseguir con el siguiente código:

Y eso es todo, espero que esta pequeña guía te ayude a hacer la integración para embeber Zoom en una web, en este caso utilizando Vuejs.