Skip to content
Go to file

vue-websocket NPM version

VueJS v1.x compatible VueJS v2.x compatible

A 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.


You can either install this package with npm, or manually by downloading the primary plugin file.


$ npm install -S vue-websocket


Download the production vue-websocket.js file. This link is a mirror of the same file found in the dist directory of this project.


Register the plugin. By default, it will connect to /:

import VueWebsocket from "vue-websocket";

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:

	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 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);





This command will build a distributable version in the dist directory:

$ npm run build


This package uses karma for testing. You can run the tests like so:

$ npm test


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.


vue-websocket is available under the MIT license.


Copyright © 2018 Icebob

@icebob @icebob

You can’t perform that action at this time.