Visión general
En esta guía aprenderá a añadir el Client SDK a su aplicación JavaScript del lado del cliente.
Requisitos previos
El Client SDK requiere Node.js y MNP.
Para añadir el Client SDK a su proyecto
Navegue hasta su aplicación
Abre tu terminal. Si ya tienes una aplicación, navega hasta su raíz. Si no, crea un nuevo directorio para tu proyecto.
Añada el Client SDK a su proyecto
Instalar el paquete Client SDK
Añadir un valor por defecto package.json corriendo:
Instale el Client SDK mediante npm:
Importe el Client SDK a su código
Si su aplicación utiliza la sintaxis de módulos ES6, puede importar el módulo cliente cerca de la parte superior del código de su aplicación:
import NexmoClient from 'nexmo-client';
Si su aplicación se ejecutará en una sola página, puede cargar el módulo en su HTML utilizando una etiqueta script:
<script src="./node_modules/nexmo-client/dist/nexmoClient.js"></script>
Asegúrese de comprobar que la ruta a nexmoClient.js es correcto para la estructura de su proyecto.
Cargar el paquete Client SDK
Cargue el Client SDK desde una red de distribución de contenidos (CDN):
Dentro de la <head> de su archivo HTML, añada:
<!-- ******* Load nexmoClient from a CDN ****** -->
<script type="module" src="https://unpkg.com/nexmo-client@latest/dist/nexmoClient.js?module"></script>
Añada el Client SDK a su código
Cerca de la parte superior del código de tu aplicación, añade:
//********* Get a reference to NexmoClient **********
const NexmoClient = window.NexmoClient;
Uso del Client SDK en su aplicación
Creación de usuarios y JWT
Se necesita un token web JSON (JWT) para iniciar sesión en tu aplicación de Vonage. El Client SDK no puede administrar usuarios ni generar JWT, por lo que debes elegir un método para manejarlo en el backend:
Para realizar pruebas, puede hacer que su aplicación cliente funcione antes de configurar el backend. generar un JWT de prueba desde la línea de comandos y codificarlo en el JavaScript del cliente.
Para el uso en el mundo real, puede entregar JWTs desde el servidor utilizando el Node o PHP SDK de backendy ajuste el
jwten su código mediante la obtención de esos datos:fetch('/getJwt') .then(results => results.json()) .then(data => { jwt = data.token; }) .catch(err => console.log(err));Más información sobre la generación de JWT en este artículo
Instanciar e iniciar sesión en NexmoClient
No se necesitan argumentos para instanciar un nuevo NexmoClientpero tendrá que pasar su JWT como argumento a createSession().
let nexmo = new NexmoClient()
.createSession(jwt)
.then(app => console.log('Logged in to app', app))
.catch(err => console.log(err));
Análisis y datos de uso del Client SDK
Para proporcionar a Vonage más información que nos permita corregir errores y crear funciones, puedes opcionalmente aceptar nuestro programa de análisis y datos de uso del Client SDK.
Para habilitar los análisis y los informes de uso de datos, configure la opción enabled parámetro de log_reporter a true. El siguiente código ofrece un ejemplo de ello:
new NexmoClient({debug:true, log_reporter: {enabled: true}})
NOTA: Esta opción está desactivada por defecto.
Conclusión
Ha añadido el Client SDK a su aplicación JavaScript del lado del cliente y ha iniciado sesión en un servidor NexmoClient que devuelve un Application objeto. Ahora puede utilizar Application.newConversation() para crear una conversación, y luego acceder a la funcionalidad de un Conversation.
Ver también
- Configuración del centro de datos - esta es una configuración opcional avanzada que puede llevar a cabo después de añadir el SDK a su aplicación.