Creación de API pub/sub genéricas con tecnología de WebSockets sin servidor en AWS AppSync - AWS AppSync
Uso de API pub/subImplementación de las API pub/sub en las aplicaciones existentes

Creación de API pub/sub genéricas con tecnología de WebSockets sin servidor en AWS AppSync

Algunas aplicaciones solo requieren API de WebSocket sencillas en las que los clientes escuchan un canal o un tema específicos. Los datos JSON genéricos sin un formato específico ni requisitos estrictamente definidos se pueden distribuir a los clientes que escuchan algunos de estos canales en un patrón de publicación suscripción (pub/sub) puro y simple.

Utilice AWS AppSync para implementar API de WebSocket pub/sub sencillas con poco o ningún conocimiento de GraphQL en cuestión de minutos mediante la generación automática de código de GraphQL tanto en el backend de la API como en el lado del cliente.

Creación y configuración de API pub/sub

Para empezar, siga estos pasos:

  1. Inicie sesión en la AWS Management Console y abra la consola de AppSync.

    1. En el Panel, elija Crear API.

  2. En la siguiente pantalla, seleccione Crear una API en tiempo real y, a continuación, seleccione Siguiente.

  3. Escriba un nombre fácil de recordar para su API pub/sub.

  4. Puede habilitar las características de API privada, pero le recomendamos que mantenga esta opción desactivada por ahora. Elija Siguiente.

  5. Puede optar por generar automáticamente una API pub/sub que funcione mediante WebSockets. También recomendamos mantener esta característica desactivada por el momento. Elija Siguiente.

  6. Seleccione Crear API y, a continuación, espere un par de minutos. Se creará una nueva API pub/sub de AWS AppSync preconfigurada en su cuenta de AWS.

La API utiliza los solucionadores locales integrados de AWS AppSync (para obtener más información sobre el uso de los solucionadores locales, consulte el Tutorial: Solucionadores locales en la Guía para desarrolladores de AWS AppSync) para gestionar varios canales pub-sub temporales y conexiones de WebSocket, que entregan y filtran automáticamente los datos a los clientes suscritos basándose únicamente en el nombre del canal. Las llamadas a la API se autorizan con una clave de API.

Una vez implementada la API, verá un par de pasos adicionales para generar el código de cliente e integrarlo con su aplicación cliente. Para ver un ejemplo de cómo integrar rápidamente un cliente, en esta guía se utilizará una sencilla aplicación web de React.

  1. Para empezar cree una aplicación de React reutilizable usando NPM en su máquina local:

    $ npx create-react-app mypubsub-app 
$ cd mypubsub-app
    nota

    En este ejemplo, se utilizan las bibliotecas Amplify para conectar los clientes a la API de backend. Sin embargo, no es necesario crear un proyecto de CLI de Amplify a nivel local. Si bien React es el cliente preferido para este ejemplo, las bibliotecas de Amplify también son compatibles con los clientes de iOS, Android y Flutter, y proporcionan las mismas capacidades en estos tiempos de ejecución diferentes. Los clientes de Amplify compatibles proporcionan abstracciones sencillas para interactuar con los backends de la API de GraphQL de AWS AppSync con apenas unas líneas de código, que incluyen funcionalidad WebSocket integrada totalmente compatible con el protocolo WebSocket en tiempo real de AWS AppSync:

    $ npm install @aws-amplify/api

  2. En la consola de AWS AppSync, selecciona JavaScript y, a continuación, Descargar para descargar un único archivo con los detalles de configuración de la API y el código de operaciones de GraphQL generado.

  3. Copie el archivo descargado en la carpeta /src de su proyecto de React.

  4. A continuación, reemplace el contenido del archivo src/App.js reutilizable existente por el código de cliente de muestra disponible en la consola.

  5. Utilice el comando siguiente para compilar y ejecutar la aplicación a nivel local:

    $ npm start

  6. Para probar el envío y la recepción de datos en tiempo real, abra dos ventanas del navegador y acceda a localhost:3000. La aplicación de muestra está configurada para enviar datos JSON genéricos a un canal con codificación rígida denominado robots.

  7. En una de las ventanas del navegador, introduzca el siguiente blob JSON en el cuadro de texto y, a continuación, haz clic en Enviar: 

    {
  "robot":"r2d2",
  "planet": "tatooine"
}

Ambas instancias del navegador están suscritas al canal de robots y reciben los datos publicados en tiempo real, que se muestran en la parte inferior de la aplicación web:

Ejemplo de aplicación de React para la API pub/sub

Todo el código de la API de GraphQL necesario, incluido el esquema, los solucionadores y las operaciones, se generan automáticamente para habilitar un caso de uso genérico de pub/sub. En el backend, los datos se publican en el punto de conexión de AWS AppSync en tiempo real con una mutación de GraphQL como la siguiente:

mutation PublishData {
    publish(data: "{\"msg\": \"hello world!\"}", name: "channel") {
        data
        name
    }
}

Los suscriptores acceden a los datos publicados que se envían al canal temporal específico con una suscripción de GraphQL relacionada:

subscription SubscribeToData {
    subscribe(name:"channel") {
        name
        data
    }
}

Implementación de las API pub/sub en las aplicaciones existentes

Si solo necesita implementar una característica en tiempo real en una aplicación existente, esta configuración genérica de API pub/sub se puede integrar fácilmente en cualquier aplicación o tecnología de API. Si bien utilizar un único punto de conexión de API para acceder, modificar y combinar de forma segura los datos de uno o más orígenes de datos en una sola llamada a la red con GraphQL, no es necesario convertir o rediseñar una aplicación existente basada en REST desde cero para aprovechar las capacidades en tiempo real de AWS AppSync. Por ejemplo, podría tener una carga de trabajo CRUD existente en un punto de conexión de API independiente en el que los clientes envíen y reciban mensajes o eventos desde la aplicación existente a la API pub/sub genérica solo para fines de pub/sub y en tiempo real.