Node.js Socket IO节点聊天服务

我发布的是我在实施在线指南时遇到的一个情况：

它工作得很好。当转到我网站上的正确组件时，我能够连接到节点服务器。我将要发布的许多代码与我在网站上找到的非常相似

我还看到了“从端口开始：3000”和“用户连接”这两个功能。但我似乎无法向服务器发送消息

以下是我认为问题所在的文件：

index.js

let express = require('express');
let app = express();

let http = require('http');
let server = http.Server(app);

let socketIO = require('socket.io');
let io = socketIO(server);

const port = process.env.PORT || 3000;

io.on('connection', (socket) => {
  console.log('user connected');

  socket.on('new-message', (message) => {
    console.log(message);
  });
});

server.listen(port, () => {
  console.log(`started on port: ${port}`);
});

export class ChatComponent implements OnInit {
  message: string;
  messages: string[] = [];

  constructor(private chatService: ChatService) {
  }

  ngOnInit() {
    this.chatService
      .getMessages()
      .subscribe((message: string) => {
        this.messages.push(message);
      });
  }

  sendMessage() {
    this.chatService.sendMessage(this.message);
    this.message = '';
  }
}

 export class ChatService {
      private url = 'http://localhost:3000';
      private socket;

      constructor() {
        this.socket = io(this.url);
      }

      public sendMessage(message) {
        this.socket.emit('new-message', message);
      }

      public getMessages = () => {
        return 

    Observable.create((observer) => {
      this.socket.on('new-message', (message) => {
        observer.next(message);
      });
        });
      }
    }

chat.componenet.html

<div class="main-container--chat">
  <div class="message-box-container">
    <div *ngFor="let message of messages">
      {{message}}
    </div>
  </div>

  <div class="chat-input">
    <input [(ngModel)]="message" (keyup)="$event.keyCode == 13 && sendMessage()"/>
    <button (click)="sendMessage()">Send</button>
  </div>
</div>

最后是chatService.service.ts

let express = require('express');
let app = express();

let http = require('http');
let server = http.Server(app);

let socketIO = require('socket.io');
let io = socketIO(server);

const port = process.env.PORT || 3000;

io.on('connection', (socket) => {
  console.log('user connected');

  socket.on('new-message', (message) => {
    console.log(message);
  });
});

server.listen(port, () => {
  console.log(`started on port: ${port}`);
});

export class ChatComponent implements OnInit {
  message: string;
  messages: string[] = [];

  constructor(private chatService: ChatService) {
  }

  ngOnInit() {
    this.chatService
      .getMessages()
      .subscribe((message: string) => {
        this.messages.push(message);
      });
  }

  sendMessage() {
    this.chatService.sendMessage(this.message);
    this.message = '';
  }
}

 export class ChatService {
      private url = 'http://localhost:3000';
      private socket;

      constructor() {
        this.socket = io(this.url);
      }

      public sendMessage(message) {
        this.socket.emit('new-message', message);
      }

      public getMessages = () => {
        return 

    Observable.create((observer) => {
      this.socket.on('new-message', (message) => {
        observer.next(message);
      });
        });
      }
    }

我尽了最大的努力使张贴的代码具体化。我希望它不至于太刺眼。尤其是在星期五

但同样，当通过节点运行index.js时。我能够查看“用户已连接”和端口：3000已启动。但是，当我发送消息时，服务器从未收到它。当我尝试console.log（“something random”）；内部：

我没有看到随机控制台日志消息出现。我不认为我的名字对新消息不正确

我是新手，所以我希望这不是什么显而易见的事情。我真的很感激任何帮助

编辑：重新启动服务器并使日志记录正常工作。但所有代码都保持不变并添加

io.emit(message);

到

---

我仍然无法在html上获取消息。

您需要在服务器上使用

emit

on

io

，特别是

io.emit（'new-message'，message）

，在socket

socket.on（'new-message'，message）

内，使用字符串消息的有效负载额外发出/广播

事件=>{}）

。通过这种方式，连接到此套接字的客户端可以接收可观察流中的

新消息

事件

io.on('connection', (socket) => {
  console.log('user connected');

  socket.on('new-message', (message) => {
    console.log(message);
    io.emit('new-message', message); // emit event
  });
});

您不需要对Angular/client代码进行任何更改。只需记住使用

complete（）

主体中的

complete（）

或终止/过滤操作符（例如）来实现对可观察对象的某种分解。否则，您可能/将有潜在的内存泄漏

---

希望这有帮助

哇，很抱歉反应太晚了。但是，它成功了！非常感谢你。谢谢你的解释。所以，如果我想要多个聊天室，我会为每个聊天室都需要一个新端口吗？我认为这是正确的。但我还有另一个问题：使用socketIO类型的变量“io”，当使用“on”函数时，第一个参数是否会取任意值？我在查找专门关于该函数的文档时遇到了一些麻烦，您可以使用文件室/名称空间，而不是新的套接字。查看此文档第一个参数不是任意的。它是字符串事件标识符。它需要在服务器和客户端之间进行有效匹配才能发送和接收消息。明白了，我现在注意到了。再次非常感谢。这是让我建立联系的关键