Javascript Socket.IO(Angular)客户端在发送到特定房间时未接收服务器发出
因此,我试图在有人使用io.to(room.id).emit()函数加入文件室后,向文件室发送一个用户列表,但客户端似乎没有收到任何东西 我的3个主要文件是: Lobbies.component.tsJavascript Socket.IO(Angular)客户端在发送到特定房间时未接收服务器发出,javascript,node.js,angular,typescript,socket.io,Javascript,Node.js,Angular,Typescript,Socket.io,因此,我试图在有人使用io.to(room.id).emit()函数加入文件室后,向文件室发送一个用户列表,但客户端似乎没有收到任何东西 我的3个主要文件是: Lobbies.component.ts constructor(private socketService: SocketService, private accountService: AccountService) { } ngOnInit(): void { this.initIoConnection();
constructor(private socketService: SocketService, private accountService: AccountService) { }
ngOnInit(): void {
this.initIoConnection();
this.accountService.GetUserbyID(this.accountService.GetUserID()).subscribe((data: User) => {
this.user = data;
})
}
//create lobby method which emits to the socket service
//while sending the user and the given lobby name
CreateLobby(){
this.socketService.emit('create', {
user: this.user,
name: this.lobbyName
});
this.lobbyName = "";
this.RefreshRooms()
}
private initIoConnection(): void {
//these methods receive the data from the socket service when ever they get a response
this.socketService.listen('getRooms')
.subscribe((data: any) => {
this.lobbyList = data;
});
this.socketService.listen('join')
.subscribe((data: any) =>{
this.inWaitingRoom = data.joinedLobby;
//emit to getUsers to retrieve the user list every time a user joins the lobby
this.socketService.emit('getUsers', data.room);
})
this.socketService.listen('getUsers')
.subscribe((data: any) => {
this.userList = data;
})
}
//this method allows a user to join a lobby
JoinLobby(data){
this.socketService.emit('join', {
user: this.user,
room: data
});
}
Socket.service.ts
constructor(){
//initialize the connection
this.socket = socketIo(environment.serverUrl)
}
socket: any;
//this method listens to the server emits and returns the info to the component
listen(eventName: string): Observable<any>{
return new Observable((subscriber) => {
this.socket.on(eventName, (data) => {
//when this method gets called from the server it'll send the data to the component
console.group();
console.log('----- SOCKET INBOUND -----');
console.log('Action: ', eventName);
console.log('Payload: ', data);
console.groupEnd();
subscriber.next(data);
});
return () => this.socket.off(eventName);
});
}
//this method emits data to the server and activates the socket.on() methods in the server
emit(eventName: string, data?: any){
console.group();
console.log('----- SOCKET OUTBAND -----');
console.log('Action: ', eventName);
console.log('Payload: ', data);
console.groupEnd();
this.socket.emit(eventName, data);
}
constructor(){
//初始化连接
this.socket=socketIo(environment.serverUrl)
}
插座:任何;
//此方法侦听服务器发出的信息并将其返回给组件
侦听(eventName:string):可观察{
返回新的可观察对象((订户)=>{
this.socket.on(eventName,(data)=>{
//当从服务器调用此方法时,它会将数据发送到组件
console.group();
log('----套接字入站---');
log('Action:',eventName);
log('Payload:',data);
console.groupEnd();
下一步(数据);
});
return()=>this.socket.off(eventName);
});
}
//此方法向服务器发送数据并激活服务器中的socket.on()方法
发出(eventName:字符串,数据?:任意){
console.group();
log('----socketoutband-----');
log('Action:',eventName);
log('Payload:',data);
console.groupEnd();
this.socket.emit(eventName,data);
}
Server.js
var express = require('express');
var app = express();
var path = require('path');
var server = require('http').createServer(app);
var io = require('socket.io')(server);
var port = process.env.PORT || 3000;
const uuid = require('uuid/v1');
app.use(express.static(path.join(__dirname, 'public')));
//list of all rooms made
const Rooms = [];
const joinRoom = (socket, user, room) =>{
var isInList = false;
var joinedLobby = false;
//retrieve correct room using the given id
var result = Rooms.find(r => r.id == room.id);
//search through the room's users to find if user has already joined the room
for (var i = 0, len = result.users.length; i < len; i++) {
if(result.users[i].id == user.id){
isInList = true;
}
}
//make the user join if he isn't found in the list
if(isInList == false){
result.users.push(user);
socket.join(room.id);
console.log(user.username, "Joined", room.name);
joinedLobby = true;
}
//return boolean
return joinedLobby;
}
io.on('connection', (socket) => {
socket.id = uuid();
console.log("A new user has connected!");
socket.on('create', (data) =>{
//create the room
var room = {
id: uuid(),
name: data.name,
users: [],
started: false,
};
//create the user and give him host role
data.user['role'] = "Host";
//add the room to the list
Rooms.push(room);
var boolean = joinRoom(socket, data.user, room);
//create an object to return all properties
var result = {
joinedLobby: boolean,
room: room
}
socket.emit('join', result);
});
socket.on('join', (data) => {
//give the user the client role
data.user['role'] = "Client";
var boolean = joinRoom(socket, data.user, data.room);
var result = {
joinedLobby: boolean,
room: data.room
}
socket.emit('join', result);
});
socket.on('getRooms', async () => {
//make a list and put all the rooms which haven't started yet
const allOpenRooms = [];
for (var i = 0, len = Rooms.length; i < len; i++) {
if(!Rooms[i].started){
allOpenRooms.push(Rooms[i]);
}
}
socket.emit('getRooms', allOpenRooms);
});
socket.on('getUsers', (data) => {
//make a list and put all the users from the room in them
const allUsers = [];
var room = Rooms.find(r => r.id == data.id);
for(var i = 0, len = room.users.length; i < len; i ++) {
allUsers.push(room.users[i]);
}
//I want to send the lsit of users to all the people in the lobby
//upon someone joining but the client is not getting a response
//It does seem to work with socket.emit but then every room gets the same list
//and that is not what i want to happen
io.to(room.id).emit('getUsers', allUsers);
});
socket.on('disconnect', () => {
console.log('User disconnected.');
});
});
server.listen(port, function () {
console.log(`listening on :${port}`);
});
var express=require('express');
var-app=express();
var path=require('path');
var server=require('http')。createServer(应用程序);
var io=require('socket.io')(服务器);
var port=process.env.port | 3000;
const uuid=require('uuid/v1');
app.use(express.static(path.join(uu dirname,'public'));
//所有房间的清单
const Rooms=[];
const joinRoom=(插座、用户、房间)=>{
var-isInList=false;
var JoinedLobble=false;
//使用给定的id检索正确的房间
var result=Rooms.find(r=>r.id==Rooms.id);
//搜索文件室的用户,以查找用户是否已加入文件室
for(var i=0,len=result.users.length;i{
socket.id=uuid();
log(“新用户已连接!”);
socket.on('create',(数据)=>{
//创建房间
var房间={
id:uuid(),
name:data.name,
用户:[],
开始:错,
};
//创建用户并给他主机角色
data.user['role']=“主机”;
//将房间添加到列表中
房间。推(房间);
var boolean=joinRoom(socket、data.user、room);
//创建一个对象以返回所有属性
var结果={
joinedLobble:boolean,
房间:房间
}
emit('join',result);
});
socket.on('join',(数据)=>{
//为用户提供客户端角色
data.user['role']=“客户端”;
var boolean=joinRoom(socket、data.user、data.room);
var结果={
joinedLobble:boolean,
房间:数据室
}
emit('join',result);
});
socket.on('getRooms',async()=>{
//列出一个清单,列出所有尚未开始的房间
常量分配房间=[];
对于(变量i=0,len=Rooms.length;i{
//列一个清单,把房间里所有的用户都放进去
常量alluser=[];
var room=Rooms.find(r=>r.id==data.id);
对于(变量i=0,len=room.users.length;i{
log('用户断开连接');
});
});
侦听(端口、函数(){
log(`listing on:${port}`);
});
使用socket.emit()可以很好地显示用户列表,但这并不是我所需要的,因为它为每个人显示用户列表,即使他们在不同的大厅中
我希望有人能帮我解决这个问题。
我非常渴望得到答案,因为我已经挣扎了好几天了
谢谢你的时间 好的,我已经自己解决了。这与我将socket.id更改为我自己的give id有关。现在我不再这样做了,它工作正常!