En este tutorial, le mostraré cómo implementar una aplicación de chat en tiempo real con Node.js, Socket.IO y MongoDB, y luego implementaremos esta aplicación en Modulus juntos..
En primer lugar, permítame mostrarle el aspecto final de la aplicación que tendremos al final del artículo..
Node.js será el núcleo de la aplicación, con Express como MVC, MongoDB para la base de datos y Socket.IO para la comunicación en tiempo real. Cuando hayamos terminado, desplegaremos nuestra aplicación a Módulo. La parte MongoDB realmente existe dentro de Módulo.
Como puede ver, esta es una aplicación muy simple, pero cubre casi todo para una aplicación web. No hay un sistema de canales en esta aplicación, pero puede bifurcar el código fuente e implementar el módulo de canales para la práctica..
Intentaré explicar primero las pequeñas piezas del proyecto y combinarlas al final. Voy a empezar desde la parte de atrás hasta la parte delantera. Entonces, comencemos con los objetos de dominio (modelos MongoDB).
Para la abstracción de la base de datos, utilizaremos Mongoose. En este proyecto, solo tenemos un modelo llamado Mensaje
. Este modelo de mensaje solo contiene texto
, Fecha de Creación
,y autor
. No hay modelo para el autor como Usuario
, porque no implementaremos completamente un registro de usuario / sistema de inicio de sesión. Habrá una página simple que proporciona el apodo, y este apodo se guardará en una cookie. Esto será utilizado en el Mensaje
modelo como texto en el autor
campo. Puedes ver un ejemplo de modelo JSON a continuación:
texto: "Hola, ¿hay algún desarrollador de Full Stack aquí?" autor: "john_the_full_stack", createDate: "2015.05.15"
Para crear documentos como este, puede implementar un modelo utilizando las siguientes funciones de Mongoose:
var mongoose = require ('mongoose') var Message = new mongoose.Schema (author: String, message: String, createDate: type: Date, default: Date.now); mongoose.model ('Mensaje', Mensaje)
Simplemente importe el módulo Mongoose, defina su modelo con sus campos y atributos de campo en formato JSON, y cree un modelo con el nombre Mensaje
. Este modelo se incluirá en las páginas que desee utilizar..
Tal vez tenga una pregunta sobre por qué almacenamos el mensaje en la base de datos, cuando ya transmitimos este mensaje al usuario en el mismo canal. Es cierto que no tiene que almacenar mensajes de chat, pero solo quería explicar la capa de integración de la base de datos. De todos modos, utilizaremos este modelo en nuestro proyecto dentro de los controladores. Controladores?
Como dije anteriormente, usaremos Express para la parte MVC. Y do
aquí representa la Controlador
. Para nuestros proyectos, solo habrá dos puntos finales para la mensajería. Una de ellas es para cargar mensajes de chat recientes, y la segunda es para manejar los mensajes de chat enviados para almacenarlos en la base de datos y luego transmitirlos al canal..
... app.get ('/ chat', function (req, res) res.sendFile (__ dirname + '/index.html');); app.get ('/ login', function (req, res) res.sendFile (__ dirname + '/login.html');); app.post ('/ messages', function (req, res, next) var message = req.body.message; var author = req.body.author; var messageModel = new Message (); messageModel.author = author; messageModel.message = message; messageModel.save (function (err, resultado) if (! err) Message.find (). sort ('- createDate'). limit (5) .exec (function (err, mensajes) io.emit ("mensaje", mensajes);); res.send ("Message Sent!"); else res.send ("¡Error técnico!"););); app.get ('/ messages', function (req, res, next) Message.find (). sort ('- createDate'). limit (5) .exec (function (err, messages) res. json (mensajes);););…
El primer y el segundo controlador son solo para servir archivos HTML estáticos para las páginas de chat e inicio de sesión. El tercero es para el manejo de la solicitud de correo a la / mensajes
punto final para crear nuevos mensajes. En este controlador, en primer lugar, el cuerpo de la solicitud se convierte al modelo de mensaje, y luego este modelo se guarda en la base de datos utilizando la función Mongoose salvar
.
No voy a bucear mucho en Mongoose; puede consultar la documentación para obtener más información. Puede proporcionar una función de devolución de llamada para que la función de guardar compruebe si hay algún problema o no. Si tiene éxito, hemos recuperado los últimos cinco registros ordenados en orden descendente por Fecha de Creación
, y han transmitido cinco mensajes a los clientes en el canal..
Ok ya hemos terminado MC
.Cambiemos a la Ver
parte.
En general, se puede utilizar un motor de plantillas como Jade, EJS, manillares, etc., dentro de Express. Sin embargo, solo tenemos una página, y ese es un mensaje de chat, así que serviré esto de forma estática. En realidad, como dije anteriormente, hay dos controladores más para servir esta página HTML estática. Puedes ver lo siguiente para servir una página HTML estática.
app.get ('/ chat', function (req, res) res.sendFile (__ dirname + '/index.html');); app.get ('/ login', function (req, res) res.sendFile (__ dirname + '/login.html'););
Este punto final simplemente sirve index.html y login.html usando res.sendFile
. Ambosindex.html y login.html están en la misma carpeta que server.js, por lo que usamos __dirname
antes del nombre del archivo HTML.
En la página de inicio, he usado Bootstrap y no hay necesidad de explicar cómo logré hacerlo. Simplemente, he enlazado una función a un cuadro de texto, y cada vez que presiona la tecla Entrar llave o Enviar Botón, el mensaje será enviado al servicio de back-end..
Esta página también tiene un archivo js requerido de Socket.IO para escuchar el canal llamado mensaje
. El módulo Socket.IO ya se importó en el back-end, y cuando usa este módulo en el lado del servidor, agrega automáticamente un punto final para servir el archivo Socket.IO js, pero usamos el que se sirve desde cdn . Cada vez que entra un nuevo mensaje en este canal, se detectará automáticamente y la lista de mensajes se actualizará con los últimos cinco mensajes..
Hay un cheque más en el código anterior: la parte de cookie. Si no ha elegido ningún apodo para chatear, significa que la cookie no está configurada para el apodo y será redirigido automáticamente a la página de inicio de sesión..
Si no, los últimos cinco mensajes serán recuperados por una simple llamada Ajax al / mensajes
punto final De la misma manera, cada vez que haga clic en el botón Enviar botón o presione el Entrar clave, el mensaje de texto se recuperará del cuadro de texto y el apodo se recuperará de la cookie, y esos valores se enviarán al servidor con una solicitud posterior. No hay una comprobación estricta para el apodo aquí, porque quería centrarme en la parte en tiempo real, no en la parte de autenticación del usuario.
Como puede ver, la estructura general del proyecto es muy simple. Vayamos a la parte de despliegue. Como dije anteriormente, usaremos Modulus, uno de los mejores PaaS para implementar, escalar y monitorear su aplicación en el idioma que elija..
Lo primero que me viene a la mente es mostrarle cómo implementar, pero para una implementación exitosa, necesitamos una base de datos que funcione. Echemos un vistazo a cómo crear una base de datos en Módulo y luego realizar la implementación.
Vaya al panel de control de Módulo después de crear una cuenta. Haga clic en el Bases de datos menú de la izquierda, y haga clic en Crear base de datos.
Rellene los campos requeridos en el formulario emergente como se muestra abajo.
Cuando complete los campos requeridos y haga clic en Crear, creará una base de datos MongoDB para usted, y verá la URL de su base de datos en la pantalla. Usaremos URI MONGO,así que copia esa URI.
En nuestro proyecto, Mongo URI se obtiene de la variable de entorno MONGO_URI
, y necesitas configurar esa variable de entorno en el panel de control. Ir al panel de control, haga clic en el Proyectos seleccione su proyecto en la lista y haga clic en Administración En el menú de la izquierda. En esta página, verá la sección de variables de entorno cuando se desplaza por la página, como se muestra a continuación.
Puedes desplegar a Módulo de dos maneras:
Continuaré con la opción de línea de comando, porque la otra es fácil de hacer. En primer lugar, instale Modulus CLI:
npm install -g modulus
Vaya a la carpeta de su proyecto y ejecute el siguiente comando para iniciar sesión en Modulus.
módulo de inicio de sesión
Cuando ejecute el comando anterior, se le solicitará que ingrese un nombre de usuario y contraseña:
Si ha creado una cuenta utilizando GitHub, puede usar la --github
opción.
módulo de inicio de sesión --github
Ahora que ha iniciado sesión en Módulo, es hora de crear un proyecto. Use el siguiente comando para crear un proyecto:
proyecto de módulo crear "chat en tiempo real"
Cuando ejecute esta función, se le pedirá el tiempo de ejecución. Seleccione la primera opción, que es Node.js, y en segundo lugar se le pedirá el tamaño del servo, y puede mantenerlo como predeterminado.
Hemos creado un proyecto, y esta vez desplegaremos nuestro proyecto actual a Módulo. Ejecute el siguiente comando para enviar el proyecto actual al Chat en tiempo real proyecto en el lado del módulo.
módulo de despliegue
Implementará su proyecto y obtendrá la URL del proyecto en ejecución al final del mensaje de implementación exitosa:
Chat en tiempo real ejecutándose en tiempo real-chat-46792.onmodulus.net
Como puede ver, el despliegue a Modulus es muy fácil.!
Modulus CLI tiene comandos muy útiles para usar durante la implementación de su proyecto o en tiempo de ejecución. Por ejemplo, para hacer un seguimiento de los registros de su proyecto en ejecución, puede usar módulo de registros de proyecto cola
, para crear un uso de la base de datos MongoDB modulo mongo crear
, para establecer una variable de entorno de uso modulo env set
, Puede ver una lista completa de comandos usando la ayuda de Modulus.
El propósito principal de este tutorial fue mostrarte cómo crear una aplicación de chat en tiempo real con Node.js, Socket.IO y MongoDB. Para ejecutar un proyecto en producción, Modulus se utiliza como proveedor de PaaS. Modulus tiene pasos muy simples para la implementación, y también tiene una base de datos interna (MongoDB) para nuestros proyectos. Además de esto, puede utilizar herramientas muy útiles dentro del panel de control de Módulo, como registros, notificaciones, escalado automático, administración de bases de datos, etc..
Para inscribirse en Modulus, haga clic aquí y obtenga $ 10 adicionales exclusivamente por ser un lector Tuts +. Usa el código de promoción ModulusChat10.
Para más información sobre la oferta de la empresa Modulus, haga clic aquí..