probil / vue-socket.io-extended

:v::zap: Socket.io bindings for Vue.js and Vuex (inspired by Vue-Socket.io)
MIT License
629 stars 38 forks source link

How to reconnect using a different URL? #541

Closed alexwohlbruck closed 2 years ago

alexwohlbruck commented 2 years ago

My app switches between a production and test server depending on some context, and these two servers live on different hosts. Is there a way to update the connection to a new url? I have tried:

// App config
const socket = io(url, ...)
Vue.use(VueSocketIOExt, socket, options)

// Later when the context changes
const newSocketConnection = io(newUrl, ...)
Vue.use(VueSocketIOExt, newSocketConnection, options)

It seems that running Vue.use on a plugin the second time doesn't replace the old instance. How can I achieve this?

alexwohlbruck commented 2 years ago

After a bit of digging through the source, I was able to find a way to reconfigure the plugin, by calling the install function manually.

import Vue from 'vue'
import VueSocketIOExt from 'vue-socket.io-extended'

function configVueSocketIO(socket) {
  VueSocketIOExt.install(Vue, socket, options)
}

// App config
const socket = io(url, options)
configVueSocketIO(socket)

// Later when the context changes
socket.disconnect()
const newSocket = io(newUrl, options)
configVueSocketIO(newSocket)

If anyone is looking for a way to do this, it works pretty well. An officially supported way to create new/multiple socket instances would be a nice addition though!