Creación de genéricos pub/sub APIs con tecnología sin servidor WebSockets en AWS AppSync - AWS AppSync GraphQL

Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

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

importante

A partir del 13 de marzo de 2025, podrás crear una PubSub API en tiempo real con la WebSockets tecnología de AWS AppSync Events. Para obtener más información, consulta Publicar eventos WebSocket en la Guía para desarrolladores de AWS AppSync eventos.

Algunas aplicaciones solo requieren aplicaciones sencillas, WebSocket APIs donde los clientes escuchan un canal o tema específico. 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.

AWS AppSync Utilízalo para implementar código GraphQL de forma sencilla y pub/sub WebSocket APIs con poco o ningún conocimiento sobre GraphQL en cuestión de minutos, ya que genera automáticamente código GraphQL tanto en el backend de la API como en el lado del cliente.

Crea y configura pub-sub APIs

Para empezar, siga estos pasos:

  1. Inicie sesión en la consola AWS Management Console y ábrala. 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. Introduce un nombre descriptivo para tu pub/sub API.

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

  5. Puedes optar por generar automáticamente una pub/sub API que funcione utilizando 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 AWS AppSync pub/sub preconfigurada en tu cuenta. AWS

La API utiliza AWS AppSync los solucionadores locales integrados (para obtener más información sobre el uso de los solucionadores locales, consulte el tutorial sobre resoluciones locales en la Guía para AWS AppSync desarrolladores) para administrar varios pub/sub canales y WebSocket conexiones temporales, lo que entrega y filtra 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 Amplify compatibles proporcionan abstracciones sencillas para interactuar con los backends de la API de AWS AppSync GraphQL con pocas líneas de código, incluidas WebSocket capacidades integradas totalmente compatibles con el protocolo en tiempo real:AWS AppSync WebSocket

    $ npm install @aws-amplify/api
  2. En la AWS AppSync consola, selecciona Descargar y JavaScript, 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, abre dos ventanas del navegador y accedelocalhost:3000. La aplicación de muestra está configurada para enviar datos JSON genéricos a un canal codificado denominadorobots.

  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 robots canal y reciben los datos publicados en tiempo real, que se muestran en la parte inferior de la aplicación web:

Ejemplo de aplicación React para API pub/sub

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

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 pub-sub APIs en aplicaciones existentes

En caso de que solo necesite implementar una función en tiempo real en una aplicación existente, esta configuración genérica de pub/sub API se puede integrar fácilmente en cualquier aplicación o tecnología de API. Si bien utilizar un único punto final de API para acceder, manipular y combinar de forma segura los datos de una o más fuentes de datos en una sola llamada de red con GraphQL, no es necesario convertir o reconstruir una aplicación existente basada en REST desde cero para aprovechar las capacidades en tiempo real AWS AppSync de GraphQL. Por ejemplo, podrías tener una carga de trabajo CRUD existente en un punto final de API independiente en el que los clientes envíen y reciban mensajes o eventos de la aplicación existente a la pub/sub API genérica solo en tiempo real y pub/sub con fines específicos.