vue-websocket
A socket.io plugin for Vue.js.
This package does not support native websockets. At the time, we recommend using vue-native-websocket or implementing it yourself. For ongoing discussion on this, please visit #2.
Installation
You can either install this package with npm
, or manually by downloading the primary plugin file.
npm
$ npm install -S vue-websocket
Manual
Download the production vue-websocket.js
file. This link is a mirror of the same file found in the dist
directory of this project.
Usage
Register the plugin. By default, it will connect to /
:
import VueWebsocket from "vue-websocket";
Vue.use(VueWebsocket);
Or to connect to another address:
Vue.use(VueWebsocket, "ws://otherserver:8080");
You can also pass options:
Vue.use(VueWebsocket, "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);
}
/* common socket.io events
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
is available under the MIT license.
Contact
Copyright © 2018 Icebob