Search code examples
javascriptreactjspollinglong-polling

Turn basic polling into long polling


I'm developing a chat application and so far i'm polling my server for messages every two seconds. To make the chat more instant i'd like to implement long polling. I'm trying to implement this JS.info Guide for it but i keep not hitting the goal i intend to hit. Can anyone point this out for my case?

I have a custom hook for this in react which is basic polling for now.

FYI: I'm a beginner and wont use WS or Socket.io now. It's too much for me at this point.

Thanks in advance!

export default function useGetChatMessages(_id) {
  const [chatMessages, setChatMessages] = React.useState([]);

  React.useEffect(() => {
    const interval = setInterval(() => {
      getChatMessages(_id).then(fetchedChatMessages => {
        setChatMessages(fetchedChatMessages);
      });
    }, 2000);
    return () => clearInterval(interval);
  }, [_id]);

  return chatMessages;
}

This is my server function with express. I guess it should be implemented here rather than in my hook

router.get('/:id/messages', async (request, response) => {
  try {
    const chat = await Chat.findById(request.params.id);
    response.json(chat.messages);
  } catch (error) {
    console.log(error);
    response.status(500).json({ message: error.message });
  }
});

Solution

  • Long polling is basically a way to keep an HTTP connection open, so you would need to implement this on the server side, your front end cannot control what the server does with the request.

    As a side note, long polling is generally much more taxing on the server than websockets, and honestly your time would be better spent implementing a websocket connection, setting up a basic ws server is not that difficult if you use a library such as socket.io

    Edit: Just as a semantic note, Long polling is an event driven way for the server to send back responses to the client without the client sending a specific request asking for that data, whereas regular polling is just sending requests at a specific interval (It sounds like you already know this because you mentioned wanting to make your polling more instant).

    If you are interested in improving your regular polling setup take a look at the other answer.