Как вставить данные с клиента на сервер с помощью socket.io?

Я создал базу данных mongochat, в которой есть коллекция chat. Как я могу вставить документ в коллекцию чата? Каждый документ имеет сообщение и дату как пары ключ-значение. Схема документа, т.е. схема сообщения:

message.js:

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

// Create Schema
const MessageSchema = new Schema({
  message: {
    type: String,
    required: true
  },
  date: {
    type: Date,
    default: Date.now
  }
});

module.exports = Message = mongoose.model('Message', MessageSchema);

server.js:

const express = require('express');
const mongoose = require('mongoose');
const socket = require('socket.io');
const message = require('./model/message')

const app = express();

const db = require('./config/keys').mongoURI;

mongoose.connect(db, {useNewUrlParser: true})
  .then(() => console.info('Mongodb connected...'))
  .catch( err => console.info(err));

const port = 5000;

let server = app.listen(5000, function(){
  console.info('server is running on port 5000')
});

let io =  socket(server);

io.on("connection", function(socket){
  console.info("Socket Connection Established with ID :"+ socket.id)

  socket.on('disconnect', function(){
    console.info('User Disconnected');
  });

   let chat = db.collection('chats');  <-- this is collection

      socket.on('SEND_MESSAGE', data => {
        io.emit('RECEIVE_MESSAGE', data);
      });
})

client.js:

    import React, { Component } from 'react'
import './chat.css'
import io from "socket.io-client";

export default class Chat extends Component {

    constructor(props){
        super(props);

        this.state = {
            message: '',
            date: '',
            messages: []
        };

        const socket = io('localhost:5000');

        this.sendMessage = event => {
            event.preventDefault();

            if (this.state.message !== ''){
                socket.emit('SEND_MESSAGE', {
                    message: this.state.message,
                    date: Date.now()
                });
                this.setState({ message: '', date: '' });
            }
        };

        socket.on('RECEIVE_MESSAGE', data => {
            addMessage(data);
        });

        const addMessage = data => {
            console.info(data);
            this.setState({
              messages: [...this.state.messages, data],
            });
            console.info(this.state.message);
            console.info(this.state.messages);
        };

    }

    render() {
        return (
        <div>              
    <div id = "messages" className = "card-block">
           {this.state.messages.map((message, index) => {
            return (
              <div key = {index} className = "msgBox"><p className = "msgText">{message.message}</p></div>
            )
          })}
    </div>
         <input id = "inputmsg" type = "text" placeholder = "Enter Message...."
         value = {this.state.message} onChange = {ev => this.setState({message: ev.target.value})}/>
    <button id = "send" className = "button" onClick = {this.sendMessage}>Send</button>               
        </div>
        )
    }
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
920
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Когда вы получите сообщение, сохраните его тело в своей коллекции следующим образом:

let chat = db.collection('chats');  <-- this is collection

  socket.on('SEND_MESSAGE', data => {
    const instance = new chat(data); <-- data as { message: '', date: '' }
    try {
        const result = await instance.save();
    } catch(...)
  });
 })

Итак, код, который вы написали, сохранит данные в mongodb, но как я могу передать эти данные для события -> RECEIVE_MESSAGE

fun joker 27.10.2018 10:43

@funjoker, если попытка блока прошла успешно, вы можете испустить событие данных в этом блоке

Nuruddin Iminokhunov 27.10.2018 10:46

В моем случае я не могу понять, как будут работать SEND_MESSAGE и RECEIVE_MESSAGE? После создания нового экземпляра, как я могу отправить обновленные данные обратно для отображения?

fun joker 27.10.2018 10:50

Другие вопросы по теме