Question

我正在使用socket.io和mysql（节点服务器）

但我在删除功能方面没有成功。

这是我拥有的以及到目前为止我所尝试的内容

io.on('connection', (socket) => {
    connection.query("SELECT * FROM `messages`", (err, data) => {
        for(let x in data) socket.emit('message', { id: data[x].message_id, text: data[x].message })
    })
    socket.on('disconnect', () => {
        // console.log('user disconnected');
    })

    socket.on('add-message', (message) => {
        addMessage(message, (res) => {
            if(res) io.emit('message', { type: 'new-message', text: message}); 
        })
    });

    socket.on('delete-message', (id) => {
        connection.query("DELETE FROM `messages` WHERE `message_id` = '"+ id +"'");
        io.emit('message', { type: 'delete-message', id: id }) // broadcast that something has changed
    })
})

Angular2服务

import { Subject } from 'rxjs/Subject'
import { Observable } from 'rxjs/Observable'
import * as io from 'socket.io-client'

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

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

    getMessages() {
        let observable = new Observable(observer => {
            this.socket = io(this.url);
            this.socket.on('message', (data) => {
                observer.next(data);
            });

            return () => {
                this.socket.disconnect();
            };  
        })

        return observable;
    }

    deleteMessage(id) {
        this.socket.emit('delete-message', id);
    }
}

组件

export class AppComponent implements OnInit, OnDestroy {
    messages = []
    connection;
    message: any;

    constructor(private chatService: ChatService){ }

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

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

    ngOnDestroy() {
        this.connection.unsubscribe();
    }

    deleteData(id): void {
        for(var i = 0; i < this.messages.length; i++) {
            if(this.messages[i].id == id) {
                this.messages.splice(i, 1)
                this.chatService.deleteMessage(id)

                break;
            }
        }
    }
}

我尝试过的问题：

对于deleteData（），单击删除按钮的用户将具有所需的视图。但对于其他用户，他们必须刷新更新的数据。

任何帮助将不胜感激。感谢。

Answer 1

您正在从客户端向您的nodejs服务器发送消息以删除该消息。然而，您在服务器端忘记的是更新其他客户端已发生变化的事情。在您的'socket.on（“delete-message”）'中，您还应该向所有连接的用户发送消息以通知他们，某些内容已更改。您可以像添加消息类似地执行此操作：

 io.emit('message', { type: 'delete-message', id: id});

顺便说一下：结帐ngrx / store。它是角度为2的Redux实现。如果您正在使用ngrx / store，则可以定义操作。操作旨在更新客户端状态。如果你使用它，你可以定义一个动作'DELETE_MESSAGE'并通过套接字从服务器发送到客户端。客户端只会将此操作发送到ngrx，您的UI将很好地更新：）。

Answer 2

首先，请记住，您需要将所有数据存储到数组消息中。

具有挑战性的部分是message_id。既然你不能把价值放在上面。假设它有一个auto_increment。我们需要添加另一个具有唯一值的表列。

对于我的例子，我将使用message_identifier

该表将具有（message_id，message_content，message_identifier）

保持这个简短。 message_identifier只有转换为毫秒的时间（我相信）。您必须创建一个使其完全不同的方法。

在服务器

上

获取以前的消息

connection.query("SELECT * FROM `messages`", (err, data) => {
    for(let x in data) socket.emit('message', { type: 'get-messages', message: data[x].message, identifier: data[x].identifier })
}

添加讯息

socket.on('add-message', function(message, identifier) {
    connection.query("INSERT INTO `messages` (`message_content`, `message_identifier`) VALUES ('"+ message +"', '"+ identifier +"')", (err) => {
        if(!err) io.emit('message', { type: 'new-message', message: message, identifier: identifier })
    })
})

删除讯息

socket.on('delete-message', function(identifier) {
    connection.query("DELETE FROM `messages` WHERE `message_identifier` = '"+ identifier +"'", (err) => {
        if(!err) io.emit('message', { type: 'delete-message', identifier: identifier })
    });
})

逻辑将在组件上。您只需要监听“消息”并通过请求传递的类型进行识别。

所以，在这里：

在组件上导入socket.io和observable并声明套接字。

import * as io from 'socket.io-client'
import { Observable } from 'rxjs/Observable'

private socket = io(/* url of server */); // inside AppComponent

在你的AppComponent类上。你需要听'消息'

let data$ = new Observable(observer => {
    this.socket.on('message', (data) => {
        if(data.type == 'get-message' || data.type == 'new-message') {
            observer.next({ message: data.message, identifier: data.identifier })
        } else if(data.type == 'delete-message') {
            for(let i = 0; i < this.messages.length; i++){
                if(parseInt(this.messages[i].identifier) == data.identifier){
                    this.messages.splice(i, 1);
                    break;
                }
            }
        }

        console.log(data)
    })
})

data$.subscribe(value => {
    this.messages.push(value);
})

你可以把它放在ngOnInit或构造函数上。我相信它应该适用于这两个。

在服务

上

只需删除getMessages，因为我们正在组件上处理它。

希望它有所帮助。干杯！

如何使用socket.io删除所有用户的邮件？

2 个答案: