Невозможно сохранить контекст при получении сообщений при выполнении длинного опроса с использованием nodejs и mongodb

Question

Я работаю над приложением, которое реализует функциональность чата, используя технику длинных опросов, где БД запрашивается для своевременного обновления.Я понимаю, что это можно сделать с помощью socket.io, но я начал с реализации с использованием длинного опроса, и у меня ограниченное время для его завершения.

Теперь у меня возникла проблема при опросе обновлений вчат и контекст для данного идентификатора чата не поддерживается.Когда происходит опрос, извлекается первое открытое сообщение чата, даже если пользователь находится в другом окне чата.Любая помощь, чтобы исправить это очень ценится.

Функция AJAX:

if(users){

    users.forEach(user => user.addEventListener('click', function(e) {

        let imageSrc = this.firstElementChild.currentSrc;
        let name = this.lastElementChild.innerText;
        let receiver = this.dataset.receiver;
        console.log(receiver);
        let sender = this.dataset.sender;
        console.log(sender);
        let countMessages = document.querySelectorAll('#chatForm span');
        let textArea = document.querySelector('.btn-send').setAttribute('data-receiver', receiver);
        swipeChat.nextElementSibling.setAttribute('src', imageSrc);
        swipeChat.parentElement.querySelector('b').innerText = name;

        setInterval(function () {
            //retreive user chat
            $.ajax({
                url: '/getMessage',
                method: 'POST',
                data : {receiver:receiver,sender:sender},
                dataType:'json',
                success: function(response){
                    let oldMessages = document.querySelectorAll('#textArea .incoming');

                    let messages = response.data;
                    let data = messages.map(message => {
                        let html = `<span class="chatMsg ${sender!=message.sender? 'incoming':'outgoing' }">${message.message}</span>`;
                        return html;
                    }).join(" ");
                    document.querySelector('#textArea').innerHTML =  data;
                    let newMessages = document.querySelectorAll('#textArea .incoming');
                    if(oldMessages.length > 0){
                        if(newMessages.length>oldMessages.length){
                            document.querySelector('#msg-new').play();
                            document.querySelector('#chatForm').scrollTop = document.querySelector('#chatForm').scrollHeight;
                        }
                    }
                }
            });
        },5000);
        }));

    }

getMessage.js

    router.post('/getMessage',function(req,res){
        Message.find(
            {$or:[
                    {sender:req.body.sender,receiver:req.body.receiver},
                    {sender:req.body.receiver,receiver:req.body.sender}
                 ]
            },
            (err,data) => {
                res.send({success:true,data:data});
            }
        );

    });

Answer 1

В этом случае при длительном опросе контекст переключался относительно идентификатора чата, поскольку предыдущие запросы ajax все еще активны. Следовательно, «получатель» получал несколько идентификаторов пользователей при нажатии на окно чата. Чтобы решить эту проблему, я использовал функцию clear interval (), как показано ниже:

var ajxReq;
var interval;
if(users){

    users.forEach(user => user.addEventListener('click', function(e){
        let imageSrc = this.firstElementChild.currentSrc;
        let name = this.lastElementChild.innerText;
        let receiver = this.dataset.chatreceiver;
        console.log("receiver"+receiver);
        let sender =  this.dataset.sender;
        let countMessages  = document.querySelectorAll('#chatForm span');
        let textArea = document.querySelector('.btn-send').setAttribute('data-receiver', receiver);
        swipeChat.nextElementSibling.setAttribute('src', imageSrc);
        swipeChat.parentElement.querySelector('b').innerText = name;
        if (ajxReq != null) {
            ajxReq = null;
            clearInterval(interval);
        }
        interval = setInterval(function(){

            //retreive user chat
            ajxReq = $.ajax({
                url: '/getMessage/'+receiver,
                method: 'POST',
                data : {sender:sender},
                dataType:'json',
                success: function(response){
                    //receiver = response.receiver;
                    let oldMessages = document.querySelectorAll('#textArea .incoming');
                    let messages = response.data;
                    let data = messages.map(message => {
                        //receiver=message.receiver;
                        let html = `<span class="chatMsg ${sender!=message.sender? 'incoming':'outgoing' }">${message.message}</span>`;
                        return html;
                    }).join(" ");
                    document.querySelector('#textArea').innerHTML =  data;
                    let newMessages = document.querySelectorAll('#textArea .incoming');
                    if(oldMessages.length > 0){
                        if(newMessages.length>oldMessages.length){
                            //console.log(`RING- ${newMessages.length} ${oldMessages.length}`);
                            document.querySelector('#msg-new').play();
                            document.querySelector('#chatForm').scrollTop = document.querySelector('#chatForm').scrollHeight;
                        }
                    }
                }
            });
        },1000);

    }));

}