我是 Socket.IO 的新手，一般來說是后端技術的新手。但是，我有使用 Vue 的經驗，并且我正在嘗試創建一個簡單的多人游戲。
但是我停留在第一步......連接vueJS和SocketIO。
這是服務器：
const app = express()
const http = require("http");
const server = http.createServer(app)
const io = require('socket.io')(8000);
io.on('connection', function(socket) {
console.log('new connection');
socket.on('updateUsers', function(data) {
console.log('event received');
});
})
這是 main.js：
import VueSocketIO from 'vue-socket.io'
import SocketIO from "socket.io-client"
import "./assets/main.css";
const app = createApp(App);
app.use(router, new VueSocketIO({
debug: true,
connection: SocketIO('http://localhost:5173/'),
}));
app.mount("#app");
和 homepage.vue：
import io from 'socket.io-client';
data() {
return {
socket: io()
}
},
methods: {
startGame() {this.socket.emit('updateUsers', "someUser")
},
}
因此，來自服務器的“新連接”都沒有在終端中呈現，前端也無法發送事件（沒有錯誤，但也沒有任何反應）你看到什么不對了嗎？可能是路由器的問題，還是因為我向應用程式傳遞了兩個引數？
app.use(router, new VueSocketIO...)
uj5u.com熱心網友回復：
您能否添加此快速中間件代碼以允許 Socket IO 服務器中的跨源請求。
app.use(function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
next()
})
uj5u.com熱心網友回復：
發現了問題，這幾乎是愚蠢的。套接字庫不支持 VueJS 3，它只支持 vueJS 2。所以有兩種方法可以讓它作業，第一種是Vue-3-Socket.io，第二種是 Vue-Socket.io 的 alpha 版本-擴展。我去了第二個，它完成了作業。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/536295.html
上一篇：如何使用mernstack和socketio構建LUDO多人游戲
下一篇：瀏覽器如何知道讀取資料結束