![](/img/trans.png)
[英]React Native socketio can' t connect to nodejs server (The server can be reached by browsers)
[英]unable to connect to nodejs server from react client with SocketIO
我正在學習socketIO
,我設置並運行了一個基本的nodejs
服務器。 我的問題是,當我嘗試使用我的nextJS
應用程序連接到服務器時,什么也沒有發生。 沒有錯誤發生,我想在連接時打印的消息也沒有出現。
我的代碼:
后端文件夾中的server.js
const express = require('express');
const app = express();
const server = require('http').Server(app);
const { v4: uuidV4 } = require('uuid');
const cors = require('cors');
const io = require('socket.io')(server, {
cors: true,
origins:["http://localhost:3000"]
});
app.use(cors());
app.options('*', cors());
io.on('connection', socket => {
socket.on('test',()=>{
console.log(' i am a test') //does not appear
})
})
//I ALSO TRIED
//io.on('test',()=>{
//console.log('I am a test');
//})
server.listen(5000);
然后在我的index.js
前端文件夾中的 nextJS 應用程序中
import {useEffect} from 'react';
import io from 'socket.io-client';
const ENDPOINT = "http://localhost:5000";
const socket = io.connect(ENDPOINT);
export default function Home() {
useEffect(()=>{
socket.emit('test');
},[]);
...rest of code
}
所以在我的前端應用程序中,我向服務器發出了“測試”事件,而服務器沒有控制台。記錄連接響應
感謝您的幫助,因為我是 socketIO 的新手
您可以在單獨的文件中創建一個幫助程序 function 來管理連接、監聽事件和發出事件。 這是一個相同的例子:
export const socketConnection = io => {
io.on("connection", socket => {
console.log("Started socket connection!");
socket.on("message", receivedMessage => {
console.log("Socket message received", receivedMessage);
});
socket.on("subscribe", async room => {
try {
console.log(`In room`, socket.rooms);
await socket.join(room);
console.log(`[socket] Room Joined Successfully : ${room}`, room);
await io.to(room).emit("subscribeSuccess", `Subscribed successfully ${socket.id}: room - ${socket.rooms}`);
} catch (e) {
console.log(`[socket] Error in Room Joining : ${room} : ${e}`, e);
socket.emit("error", "couldnt perform requested action");
}
});
socket.on("unsubscribe", async room => {
try {
await socket.leave(room);
console.log(`[socket] Room Left Successfully : ${room}`, room);
} catch (e) {
console.log(`[socket] Error in Room Leaving : ${room} : ${e}`, e);
socket.emit("error", "couldnt perform requested action");
}
});
});
};
然后在app.js
中你可以導入並啟動一個套接字服務器。
import { socketConnection } from "@helpers";
const io = new Server(server, {
transports: ["websocket", "polling"],
allowEIO3: true
});
socketConnection(io);
並從客戶端連接到套接字使用這個:
import io from 'socket.io-client';
const ENDPOINT = "http://localhost:5000";
const socket = io(ENDPOINT);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.