Динамически соединяющиеся комнаты в Vue SocketIO

Question

Я использую Vue SocketIO на внешнем интерфейсе и хотел бы, чтобы мое приложение динамически объединяло комнаты, основываясь на пользовательских данных.

Эта функция еще не доступна в пакете (автор работает над ней), и мне было интересно узнать, как ее взломать вместе.

Я настраиваю SocketIO в своем основномФайл приложения выглядит следующим образом:

import VueSocketIO from 'vue-socket.io'
import io from 'socket.io-client';

const token = window.localStorage.getItem('token');
const socketInstance = io(require('../config/web').socket_url, {
    transports: ['websocket', 'polling'],
    transportOptions: {
        polling: {
            extraHeaders: {
                Authorization: token
            }
        }
    }
});
Vue.use(new VueSocketIO({
    debug: true,
    connection: socketInstance,
    vuex: {
        store,
        actionPrefix: 'SOCKET_',
        mutationPrefix: 'SOCKET_'
    }
}));

В моем компоненте я пытаюсь присоединиться следующим образом:

selectSession () {
                console.log(this.$socket)
                // this.$socket.join(this.subscribedSession)
            }

, что не удается, поскольку у этого сокета нет метода соединения.

У кого-нибудь есть идеи, как взломать это?

Answer 1

Это не проблема с пакетом VueSocketIO или даже socket.io-client

. vue.$socket является экземпляром socket.io-client и поэтому имеет все функции, которые предоставляет собственный клиент.

Проблема в том, что вы не можете присоединиться к комнатам со стороны клиента, это только функция со стороны сервера.

Если вы посмотрите на нативный клиентский документ socket.io API документы , выобнаружит, что на клиентском объекте нет метода join, не потому, что они его не реализовали, а потому, что он может по своей природе не существовать

Так как же тогда это исправить?

Я рад, что вы спросили ...

Я предлагаю создать серверный обработчик с именем join, который принимает имя комнаты в качестве аргумента, а затем сервер присоединяет сокет к комнате

const express = require("express");
const io = require('socket.io')(express());

io.on("connection", socket => {
  socket.on("join", roomName => {
    socket.join(roomName);
  }
};

Тогда от вашего клиента вы можете использовать:

socket.emit("join", "chatroom1");

ПРИМЕЧАНИЕ. Это может быть проблемой безопасности.