Vue-Socket Mutation Listener

428 Views Asked by At

I recently changed over to connecting to a namespace on the socket. Previously the connection was working fine and my Vuex mutations were catching the emission from the server.
After switching to the namespace I have verified that the connection is being made and the correct event is firing on the socket, but my Vuex mutation is no longer firing.

Here is the applicable code:

Server Side

const complianceNamespace = IO.of("/compliance");
complianceNamespace.on("connection", function (socket) {
      socket.on("UPDATE_REQUEST_SERVICE", function (requestService) {
        IO.emit("UPDATE_REQUEST_SERVICE", requestService);
      });
      socket.on("ADD_REQUEST_SERVICE", function (requestService) {
        IO.emit("ADD_REQUEST_SERVICE", requestService)
      });
});

Client Side

const SocketInstance = process.env.NODE_ENV === 'development' ? socketio('http://localhost:3001/compliance') : socketio('https://real.address.com/compliance');

Vue.use(new VueSocketIO({
   debug: false,
   connection: SocketInstance,
   vuex: {
      store,
      actionPrefix: 'SOCKET_',
      mutationPrefix: 'SOCKET_'
   }
}));

// Mutation
      SOCKET_UPDATE_REQUEST_SERVICE(state, requestService) {
        // some code runs
      }

Again, I have verified that the socket is getting to UPDATE_REQUEST_SERVICE, but the mutation is never being run when the socket emits, it worked when not using namespace.

I am thinking that the prefix is altered or doesn't work when using a namespace?

1

There are 1 best solutions below

0
On

Answer: mistake within the namespace connection event listeners. I was setting up a connection with the namespace (complianceNamespace) then emitting events to a different connection (IO).
Correction code:

complianceNamespace.on("connection", (socket) => {
  socket.on("SOME_EVENT", function(user) {
    complianceNamespace.emit("SOME_EVENT", user);
  }
});