vue-websocket-next v0.2.7
vue-websocket-next
A socket.io plugin for Vue.js.
Installation
npm
$ npm install vue-websocket-next
Usage
Register the plugin. By default, it will connect to /
:
import VueWebsocket from "vue-websocket";
import IO from 'socket.io-client';
Vue.use(VueWebsocket, IO);
Or to connect to another address:
Vue.use(VueWebsocket, IO, "ws://otherserver:8080");
You can also pass options:
Vue.use(VueWebsocket, IO, "ws://otherserver:8080", {
reconnection: false
});
To use it in your components:
<script>
export default {
methods: {
add() {
// Emit the server side
this.$socket.emit("add", { a: 5, b: 3 });
},
get() {
this.$socket.emit("get", { id: 12 }, (response) => {
...
});
}
},
socket: {
// Prefix for event names
// prefix: "/counter/",
// If you set `namespace`, it will create a new socket connection to the
// namespace instead of `/`
// namespace: "/counter",
events: {
// Similar as this.$socket.on("changed", (msg) => { ... });
// If you set `prefix` to `/counter/`, the event name will
// be `/counter/changed`
//
changed(msg) {
console.log("Something changed: " + msg)
}
connect() {
console.log("Websocket connected to " + this.$socket.nsp)
},
disconnect() {
console.log("Websocket disconnected from " + this.$socket.nsp)
},
error(err) {
console.error("Websocket error!", err)
}
}
}
}
</script>
Develop
Building
This command will build a distributable version in the dist
directory:
$ npm run build
Testing
This package uses karma
for testing. You can run the tests like so:
$ npm test
Contribution
Please send pull requests improving the usage and fixing bugs, improving documentation and providing better examples, or providing some testing, because these things are important.
License
vue-websocket-next
is available under the MIT license.
This package was originally developed by Icebob. But it is now maintained by CGWire.
About CGWire
CGWire is a company based in France. We help teams of animation studios to collaborate better. We provide tools to more than 50 studios spread all around the world.
On the technical side, we apply software craftmanship principles as much as possible. We love coding and consider that strong quality and good developer experience matter a lot.
Visit cg-wire.com for more information.