Open xreider opened 3 years ago
解决了吗
解决了吗
我过一会分开地试试做API服务器和使用Vue-Socket.io的Nuxt的软件。 现在分开地做了API服务器和使用Nuxt-Socket.io的Nuxt的软件就没问题了!
https://stackoverflow.com/questions/66047026/socket-io-v3-unsupported-protocol-version-error - allowEIO3: true set server options!!!
I have solved the above problem by the following Source Code :
____Server Side Code____
// For Allowing Cross Site Origin Requests
var cors = require('cors');
const app = require('express')();
app.use(cors());
const http = require('http').Server(app); const io = require('socket.io')(http,{ cors:{ origin:"http://localhost:8080", methods: ["GET","POST"], credentials: true, allowEIO3: true }, transport: ['websocket'] });
//Whenever someone connects this gets executed io.on('connection', function(socket) { console.log('A user connected');
//Whenever someone disconnects this piece of code executed socket.on('disconnect', function () { console.log('A user disconnected'); }); });
http.listen(3000, function() { console.log('listening on *:3000'); });
Client Side Code
// Packages For Establishing Socket Connection import SocketIO from 'socket.io-client' import VueSocketIO from 'vue-socket.io'
Vue.use(new VueSocketIO({ debug: true, connection: SocketIO('http://localhost:3000/'), vuex: { store, actionPrefix: 'SOCKET', mutationPrefix: 'SOCKET' }, extraHeaders: { 'Access-Control-Allow-Credentials':true }, allowEIO3:true }))
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import VueSocketIO from "vue-socket.io";
import { io } from "socket.io-client";
const socket = io("http://localhost:3000", { transports: ["websocket", "polling", "flashsocket"] });
createApp(App)
.use(router)
.use(
new VueSocketIO({
debug: true,
connection: socket,
//options object is Optional
})
)
.mount("#app");
I passed a transports option like this using socket.io-client and it works.
good job
If your backend server uses CORS with auth
put in socket options withCredentials: true,
. It will just go silent without throwing the error if you use WebSocket as a first transport.
server
frontend
got
headers