我在这里发布一个与编程有关的情况,我遇到了在线指南的实现问题:https://codingblast.com/chat-application-angular-socket-io/
一开始运行得很好。当我访问网站上正确的组件时,我能够连接到节点服务器。我将发布的大部分代码都非常类似于我在网站上找到的内容。
此外,我已经达到了能够看到“已启动端口:3000”和“用户已连接”的地步。这是有效的。但是我似乎无法将消息发送到服务器。
这是我认为问题发生的文件:
我尽力让发布的代码具体化。希望这不会太过刺眼,特别是在周五。
但是,当通过Node运行index.js时,我可以看到“用户连接”和端口:3000已启动。但是,当我发送消息时,服务器从未收到它。同时,当我尝试在内部使用console.log(“somethign random”)时:
我没有看到那个随机的控制台日志消息出现。我不认为我的new-message命名有误。
我是新手,所以希望这不是什么显而易见的问题。我非常感谢任何帮助。
编辑:重新启动服务器并让日志记录工作。但所有代码保持不变并添加。
此外,我已经达到了能够看到“已启动端口: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}`);
});
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>
chat.component.ts
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 = '';
}
}
最后是 chatService.service.ts
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);
});
});
}
}
我尽力让发布的代码具体化。希望这不会太过刺眼,特别是在周五。
但是,当通过Node运行index.js时,我可以看到“用户连接”和端口:3000已启动。但是,当我发送消息时,服务器从未收到它。同时,当我尝试在内部使用console.log(“somethign random”)时:
socket.on('new-message', (message) => {
console.log(message);
});
我没有看到那个随机的控制台日志消息出现。我不认为我的new-message命名有误。
我是新手,所以希望这不是什么显而易见的问题。我非常感谢任何帮助。
编辑:重新启动服务器并让日志记录工作。但所有代码保持不变并添加。
io.emit(message);
到
socket.on('new-message', (message) => {
console.log(message);
});
我仍然没有收到HTML上的消息。