Длительный цикл событий Node.js разбивает весь код

Question

Я совершенно не знаком с программированием, и на этом этапе разработки моего сайта мне нужно настроить простой длинный запрос опроса, чтобы получить самые новые сообщения из db, а затем показать их для клиента. Я создал систему обмена сообщениями в последний день, и теперь он сохраняет сообщения со всеми необходимыми отношениями между сообщениями и пользователей ...

Вот что я сделал:

var express = require('express'); 
 
var router = express.Router(); 
 
var Conversation = require('../models/conversation'); 
 
var Promise = require('promise'); 
 

 
// Get Homepage 
 
router.get('/', function(req, res){ 
 
\t res.render('index'); 
 
}); 
 

 

 
var messages = []; 
 
router.get('/inbox', function(req, res){ 
 
\t var promise = new Promise(function (resolve, reject) { 
 
\t \t req.user.conversations.forEach(function(id){ 
 
\t \t \t Conversation.getConversationById(id, function(err, conv){ 
 
\t \t \t \t if (conv){ 
 
\t \t \t \t \t messages.push(conv); 
 
\t \t \t \t \t if(messages.length == req.user.conversations.length){ 
 
\t \t \t \t \t \t resolve(messages); 
 
\t \t \t \t \t \t messages = []; 
 
\t \t \t \t \t } 
 
\t \t \t \t } else { 
 
\t \t \t \t \t console.log(err); 
 
\t \t \t \t } 
 
\t \t \t }); 
 
\t \t }); 
 
\t }).then(function(object){ 
 
\t \t res.render('inbox', {convers: object}); 
 
\t }).catch(function(err){ 
 
\t \t console.log(err); 
 
\t }); 
 
}); 
 

 
// Add new messages to messagesArray -> mesgArray to display them 
 
var mesgArray = []; 
 
var userIdFor = ""; 
 
router.post('/messages', function(req, res){ 
 
\t var convId = req.body.conversationId; 
 
\t userIdFor = req.user.id; 
 
\t var promise = new Promise(function(resolve, reject){ 
 
\t \t Conversation.getConversationById(convId, function(err, conver){ 
 
\t \t \t if (err){ 
 
\t \t \t \t console.log(err); 
 
\t \t \t } else { 
 
\t \t \t \t conver.messages.forEach(function(messa){ 
 
\t \t \t \t \t mesgArray.push({msg: messa.msg, owner: messa.msgOwner, ownerName: messa.msgOwnerName}); 
 
\t \t \t \t \t if(mesgArray.length == conver.messages.length){ 
 
\t \t \t \t \t \t resolve(mesgArray); 
 
\t \t \t \t \t } 
 
\t \t \t \t }); 
 
\t \t \t } 
 
\t \t }); 
 
\t }).then(function(object){ 
 
\t \t res.send({allMessages: object, userId: userIdFor}); 
 
\t \t mesgArray = []; 
 
\t \t userIdFor = ""; 
 
\t }).catch(function(err){ 
 
\t \t console.log(err); 
 
\t }); 
 
}); 
 

 
// Save posted message to existent conversation 
 
router.post('/saveMsg', function(req, res){ 
 
\t var conversationId = req.body.conversationId; 
 
\t var messageToSave = req.body.message; 
 
\t console.log(messageToSave); 
 
\t console.log(conversationId); 
 
\t Conversation.getConversationById(conversationId, function(err, conversation){ 
 
\t \t if (err){ 
 
\t \t \t console.log(err); 
 
\t \t } else { 
 
\t \t \t Conversation.getConversationById(conversationId, function(err, conversation){ 
 
\t \t \t \t if(err){ 
 
\t \t \t \t \t console.log(err) 
 
\t \t \t \t } else { 
 
\t \t \t \t \t conversation.messages.push({ 
 
\t \t \t \t \t \t msg: messageToSave, 
 
\t \t \t \t \t \t msgOwner: req.user.id, 
 
\t \t \t \t \t \t msgOwnerName: req.user.firstName 
 
\t \t \t \t \t }); 
 
\t \t \t \t \t conversation.save(function(err){ 
 
\t \t \t \t \t \t if(err){ 
 
\t \t \t \t \t \t \t console.log(err); 
 
\t \t \t \t \t \t } 
 
\t \t \t \t \t }) 
 
\t \t \t \t } 
 
\t \t \t }); 
 
\t \t } 
 
\t }); 
 
}); 
 

 
module.exports = router;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> 
 
<!-- REPLAY MESSAGE BOX --> 
 
<div class="contact-form-container hidden-mode"> 
 
    <div class="row hide-contact text-right"> 
 
    <img src="/images/close.png"> 
 
    </div> 
 
    <form> 
 
    <div class="inbox-all-messages-container"> 
 
     <div class="row inbox-all-messages"> 
 
     <!-- Here will be all the messages --> 
 
     </div> 
 
     <div class="row text-center inbox-send-input"> 
 
     <div class="col-lg-11 col-md-11 col-sm-11"> 
 
      <textarea class="inbox-message-response-txt" placeholder="Type your message here"></textarea> 
 
     </div> 
 
     <div class="col-lg-1 col-md-1 col-sm-1 text-center inbox-message-send-btn"> 
 
      <p class="inbox-message-send-msg-btn">Send</p> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </form> 
 
</div> 
 
<script> 
 
    $(document).ready(function(){ 
 

 
    var convId = ""; 
 
    $('.inbox-messager').on('click', function(){ 
 
    $('.inbox-all-messages').empty(); 
 
     var conversationId = this.getAttribute("data-conv-id"); 
 
     convId = conversationId; 
 
     $.ajax({ 
 
     url: '/messages', 
 
     method: 'POST', 
 
     contentType: 'application/json', 
 
     data: JSON.stringify({conversationId: conversationId}), 
 
     success: function(response){ 
 
      response.allMessages.forEach(function(message){ 
 
      if(message.owner == response.userId){ 
 
       $('.inbox-all-messages').append(
 
       '<div class="row inbox-message-structure-meNot">'+ 
 
        '<div class="row inbox-message-header">'+ 
 
         '<div class="inbox-message-ava col-lg-1 col-md-1 col-sm-1">'+ 
 
         '<img src="/images/avatar.jpg" class="inbox-message-header-ava-img">'+ 
 
         '</div>'+ 
 
         '<div class="inbox-message-header-senderName col-lg-3 col-md-3 col-sm-3">'+ 
 
         '<p>' + message.ownerName + '</p>'+ 
 
         '</div>'+ 
 
         '<div class="col-lg-3 col-lg-offset-5 col-md-3 col-md-offset-5 col-sm-3 col-sm-offset-5 inbox-message-header-sentTime text-right">'+ 
 
         '<p>24/05/2016</p>'+ 
 
         '</div>'+ 
 
        '</div>'+ 
 
        '<div class="row inbox-message-body">'+ 
 
        '<div class="col-lg-9 col-lg-offset-1 col-md-9 col-md-offset-1 col-sm-9 col-sm-offset-1 text-left">'+ 
 
         '<p>' + message.msg + '</p>'+ 
 
        '</div>'+ 
 
        '</div>'+ 
 
       '</div>' 
 
      ); 
 
       
 
      } else { 
 
       $('.inbox-all-messages').append(
 
       '<div class="row inbox-message-structure-me">'+ 
 
        '<div class="row inbox-message-header">'+ 
 
         '<div class="inbox-message-ava col-lg-1 col-md-1 col-sm-1">'+ 
 
         '<img src="/images/client.jpg" class="inbox-message-header-ava-img">'+ 
 
         '</div>'+ 
 
         '<div class="inbox-message-header-senderName col-lg-3 col-md-3 col-sm-3">'+ 
 
         '<p>' + message.ownerName + '</p>'+ 
 
         '</div>'+ 
 
         '<div class="col-lg-3 col-lg-offset-5 col-md-3 col-md-offset-5 col-sm-3 col-sm-offset-5 inbox-message-header-sentTime text-right">'+ 
 
         '<p>24/05/2016</p>'+ 
 
         '</div>'+ 
 
        '</div>'+ 
 
        '<div class="row inbox-message-body">'+ 
 
        '<div class="col-lg-9 col-lg-offset-1 col-md-9 col-md-offset-1 col-sm-9 col-sm-offset-1 text-left tester">'+ 
 
         '<p>' + message.msg + '</p>'+ 
 
        '</div>'+ 
 
        '</div>'+ 
 
       '</div>' 
 
      ); 
 
      } 
 
      }); 
 
      $('.inbox-all-messages').append('<div id="bottom"></div>'); 
 
      $('.inbox-all-messages').scrollTo('#bottom', 100, "max"); 
 
     } 
 
     }); 
 
     $('.contact-form-container').removeClass('hidden-mode'); 
 
     $('.messenger-contaner').addClass('stop-scroll'); 
 
     
 
    }); 
 

 
    $('.hide-contact').on('click', function(){ 
 
    $('.contact-form-container').addClass('hidden-mode'); 
 
    $('.messenger-contaner').removeClass('stop-scroll'); 
 
    }); 
 

 
    $('.inbox-message-send-msg-btn').on('click', function(){ 
 
    var messageToSend = $('.inbox-message-response-txt').val(); 
 
    $.ajax({ 
 
     url: '/saveMsg', 
 
     method: 'POST', 
 
     contentType: 'application/json', 
 
     data: JSON.stringify({message: messageToSend, conversationId: convId}), 
 
     success: function(response){ 
 
     alert('le message a bien ete enregistree'); 
 
     } 
 
    }); 
 
    }); 
 
}) 
 

 
</script>

Теперь я может отправлять сообщения и хранить их в моем mongoDB, но мне нужно обновить страницу, чтобы получить новые сообщения ... Поэтому я пытаюсь настроить длинный запрос опроса, но не могу найти решение, потому что каждый раз, когда я устанавливаю цикл в мой код jQuery разбивает всю страницу, и он больше не может открыть разговор. Если кто-то может помочь мне улучшить мой код и настроить простую технологию, чтобы получить сообщение без обновления страницы, было бы так замечательно!

Извините за мой плохой английский! И большое спасибо за нас!

Answer 1

Если вы совершенно новичок в программировании, как вы сказали, вместо того, чтобы пытаться создать функциональность с нуля, с которой вы столкнулись, возможно, использование рабочего решения было бы лучшей идеей.

Вы можете использовать Socket.io для такого рода вещей. Он использует длительный опрос и пытается обновиться до WebSocket, если он поддерживается. Это очень просто использовать. Вот весь рабочий пример сервера, который посылает запросы к клиенту:

var path = require('path'); 
var app = require('express')(); 
var http = require('http').Server(app); 
var io = require('socket.io')(http); 
app.get('/', (req, res) => { 
    res.sendFile(path.join(__dirname, 'si.html')); 
}); 
io.on('connection', s => { 
    for (var t = 0; t < 3; t++) 
    setTimeout(() => s.emit('message', 'message from server'), 1000*t); 
}); 
http.listen(3002,() => console.error('listening on http://localhost:3002/')); 

А вот весь код JavaScript на клиенте:

var l = document.getElementById('l'); 
var log = function (m) { 
    var i = document.createElement('li'); 
    i.innerText = new Date().toISOString()+' '+m; 
    l.appendChild(i); 
} 
log('opening socket.io connection'); 
var s = io(); 
s.on('connect_error', function (m) { log("error"); }); 
s.on('connect', function (m) { log("socket.io connection open"); }); 
s.on('message', function (m) { log(m); }); 

Для большего количества примеров и лучшего объяснения см the project on GitHub, которые Я создал, чтобы продемонстрировать использование отправки сообщений клиенту.

Смотрите также другие связанные вопросы для получения более подробной информации:

• Differences between socket.io and websockets
• socket.io no communication between server and client
• why web socket behave differently on nodejs ?
• getting an error when trying to use socket.io
• How to use Socket.io combined with Express.JS