Real-time Chat Forum using Strapi, Socket.io, React and MongoDB

1

This article is a guest post by Purnima Gupta. She's a web developer and wrote this blog post through the Write for the Community program.

This is a companion discussion topic for the original entry at https://strapi.io/blog/how-to-build-a-real-time-chat-forum-using-strapi-socket-io-react-and-mongo-db
2

@purnimagupta I’m struggling to do this with react native. I was able to connect with react from a browser app however I can’t seem to do the same for my react-native mobile app. Is this done differently in react native?

3
4

It would be great of this article could be updated to work with v4… I tried the following code in src/index.js:

module.exports = {

  register(/*{ strapi }*/) {},

  bootstrap({ strapi }) {
    const io = require('socket.io')(strapi.server, {
      cors: {
        origin: 'http://localhost:3000',
        methods: ['GET', 'POST'],
        allowedHeaders: ['my-custom-header'],
        credentials: true
      }
    })
  },
};

And my app crashed with this error: TypeError: server.listeners is not a function I tried to do it with setTimeout, with process.nextTick() - always the same result, same error.

5

might be late, but just in case.

do it like this in src/index.js

const {Server} = require(‘socket.io’)
const io = new Server(strapi.server.httpServer, {
cors: {
origin: “http://localhost:3000”,
methods: [“GET”, “POST”],
allowedHeaders: [“my-custom-header”],
credentials: true
}
})

6 
var io = require('socket.io')(strapi.server.httpServer, {
  cors: {
    origin: "http://localhost:3000",
    methods: ["GET", "POST"],
    transports: ['websocket', 'polling'],
    allowedHeaders: ["my-custom-header"],
    credentials: true
  },
  allowEIO3: true
});

This worked for me.

7

That is such an amazing article and I just want to recommend you that app developers in Bahrain is offering the best and most professional services that can be best for your digital growth.