Question

我目前正在使用VueCLI和Nodejs开发聊天应用程序。

因此，我已经建立了代理连接，并且一切正常，包括从前端发出的消息，但VueCLI组件没有监听从服务器发出的事件。

这是vue组件中的“ sockets”对象。（在下面的代码中，控制台中两个对象均未显示任何内容。）

sockets: {
    connect: () => {
        console.log('socket connected');
    },
    chat: (data) => {
        console.log(data);
    }
}

这是“ main.js”中我的vue-socket.io配置：

import VueSocketIO from 'vue-socket-io'

export const SocketInstance = "http://localhost:9000";
Vue.use(VueSocketIO, SocketInstance);

这也是我的“ server.js”代码：

let io = socket(server);

io.on('connection', (socket) => {
    console.log(`One user joined the chat with ID: ${ socket.id }`)

    socket.on("chat", async (chat) => {
        chat.created = new Date();
        let response = await new Message(chat).save();
        io.emit("chat", chat);
    });
})

这是我第一次将socketIO与前端框架一起使用，并且已经很累人了。

Answer 1

将其放入server.js

let io = socket(server);

io.sockets.on('connection', (socket) => {
    console.log(`One user joined the chat with ID: ${ socket.id }`)

    socket.on("chat", async (chat) => {
        chat.created = new Date();
        let response = await new Message(chat).save();
        io.sockets.emit("chat", chat);
    });
})

Vue CLI没有监听SocketIO事件

1 个答案: