Crear una aplicación de fondo para el chat en línea de Apollo, Node.js

Hace algún tiempo estaba trabajando en una aplicación móvil, cuya funcionalidad incluía un conveniente chat en línea. Y ahora decidí escribir un artículo con breves instrucciones sobre cómo crear un chat usando el servidor apollo y node.js en el backend, así como reaccionar con el cliente nativo y apollo del lado del cliente.

El artículo está dividido en dos partes para facilitar la lectura. La primera parte contiene una guía para crear un backend de aplicación, y la segunda contiene una guía para crear un front-end de aplicación.

Si eres demasiado vago para leer, puedes ver inmediatamente el código en Github'e aquí y aquí .

Como las principales tecnologías para la implementación, elegí el framework node.js koa , la base de datos postgresql , así como el servidor GraphQL - apollo-server-koa .

En primer lugar, se generó un proyecto vacío de koa2, para esto utilicé un simple generador de koa ejecutando el comando en la terminal:

$ koa <project name> 

Luego se instalaron las dependencias necesarias, lo hago con hilo, pero puedes usar npm.

 $ yarn add apollo-server-koa knex objection pg 

Todas las bibliotecas necesarias están instaladas, ahora puedes escribir código

Para conectarse a la base de datos, debe describir dos archivos, el primero es db.js, que exportará la instancia del cliente knex y permitirá que nuestros modelos trabajen con datos de la base de datos, el segundo es knexfile.js, que contiene la configuración de conexión de la base de datos para crear y migraciones sucesivas.

El código db.js se describe a continuación, tenga en cuenta que todas las configuraciones se toman de las variables de entorno:

 const db = require('knex')({ client: 'pg', connection: {   host : process.env.POSTGRES_HOST,   port: process.env.POSTGRES_PORT,   user : process.env.POSTGRES_USER,   password : process.env.POSTGRES_PASSWORD,   database : process.env.POSTGRES_DATABASE } }); module.exports = db; 

El código knexfile.js está disponible aquí .

Ahora puede describir las migraciones para crear las dos tablas que necesitamos.

Las tablas en sí serán lo más simples posible y contendrán solo el conjunto mínimo de campos requeridos. El comando para crearlos está a continuación:

 $ knex migrate:make migration_name 

Puede ver los archivos de migración aquí .

Ahora cree los modelos de entidad Mensaje y Usuario

 class Message extends Model { static get tableName() {   return 'messages'; } $beforeInsert() {   this.created_at = new Date().toISOString(); } static get relationMappings() {   return {     user: {       relation: Model.BelongsToOneRelation,       modelClass: User,       join: {         from: 'messages.user_id',         to: 'users.id'       }     }   }; } } 

Lo más interesante permaneció: conectar y configurar apollo-server-koa, descripción de esquemas y resolvers de graphql.

Para conectar apollo-server-koa, solo agregue las siguientes líneas de código

app.js:

 const { ApolloServer } = require('apollo-server-koa'); const graphqlSchema = require('./graphqlSchema'); … const apolloServer = new ApolloServer(graphqlSchema); apolloServer.applyMiddleware({ app }); 

www:

 var { app, apolloServer } = require('../app'); ... apolloServer.installSubscriptionHandlers(server); 

Además de conectar apollo-server-koa, hemos incluido la capacidad de trabajar con suscripciones para notificar a los clientes que ha llegado un nuevo mensaje al chat.

Apollo-server-koa está conectado, el siguiente paso es una descripción del diagrama graphql con los tipos necesarios para el chat

 input UserInput { username: String! } input MessageInput { text: String! user_id: ID! } type User { id: ID username: String } type Message { id: ID text: String created_at: String user: User } type Query { getLast100Messages: [Message] } type Mutation { findOrCreateUser(user: UserInput!): User createMessage(message: MessageInput!): Message } type Subscription { messageCreated: Message } 

El circuito está listo, describimos los resolvers

Un ejemplo de un solucionador para enviar un nuevo mensaje:

 const Message = require('../../models/message'); const { pubsub, MESSAGE_CREATED } = require('../../utils'); module.exports = { createMessage: async (obj, { message }, context, info) => {   const createdMessage = await Message     .query()     .insert(message);   const resultMessage = await Message     .query()     .eager('user')     .findById(createdMessage.id);   pubsub.publish(MESSAGE_CREATED, { messageCreated: resultMessage });   return resultMessage; }, }; 

Un punto interesante es que, además de guardar el mensaje en la base de datos, se llama a la función Publish (), que notifica a todos los suscriptores sobre el evento MESSAGE_CREATED, enviándoles el objeto de un nuevo mensaje (el lector atento notará que el remitente también será notificado de su nuevo mensaje, y lo procesaremos más adelante). para el cliente, en un proyecto real, tiene sentido procesar esto en el lado del backend, para no duplicar la lógica entre diferentes clientes).

El código de los resolvers restantes se puede encontrar aquí .

El lado del servidor del chat está listo, ¿cómo puedo verificar que todo esté funcionando?

Abra el host en su navegador y verá el patio de juegos graphql en él.



En la siguiente parte, crearemos una aplicación móvil.