[Vuejs]-How to make my vue component connect to my node server

2๐Ÿ‘

โœ…

A few things. First I am going to assume that you are using the vue-cli webpack starter since you have a main.js and a .vue file.

You only need to use the socket.io middleware on the front end in your main.js. This will add a $socket property to all components that allows you to interact with the socket. You should remove the Vue.use(SocketIO) from Test.vue

Second, in main.js you have the connection set up as

Vue.use(VueSocketIO, 'http://localhost.com:8890');

when it should be

Vue.use(VueSocketIO, 'http://localhost:3000');

localhost.com is not your socket server. if your socket server is in dns or your host file it would be something like myserver.domain.com but since you are running the socket server and vue frontend on the same machine you can just use localhost or 127.0.0.1 (in most cases) as the server address

If you want to use port 8890, then you will need to change

server.listen(3000, function() {

to

server.listen(8890, function() {

in your server code.

๐Ÿ‘คvbranden

Leave a comment