React全Hook项目实战在线聊天室历程（完结）：删帖功能

前情提要：

React全Hook项目实战在线聊天室历程（一）：基本功能
React全Hook项目实战在线聊天室历程（二）：引用与话题功能
React全Hook项目实战在线聊天室历程（三）：加个音乐直播？

管理员的权限

只要是在线提供服务的网站一定会有管理员的存在，那我们也给聊天室加一个管理员，不过简单一些，这个管理员只有删帖的功能。

实现思路

为了简单，直接使用SubmitContainer来作为登录窗口，后端根据“tag”属性是否等于特定字符串，来判断前端发来的消息是否是登录的账号密码。登录成功后，后端生产token，前端保存，使用删帖操作时需要带上token，否则无法执行删帖操作。

后端

后端引入jsonwebtoken

npm install jsonwebtoken

修改数据库message表，增加一个字段deleted 默认值为0，被删除时值为1。
修改db.js

// 新增一个删除操作
function deleteMessage(no, callback) {
   
    let sql = "UPDATE message SET deleted=1 where no=?"
    try {
   
        conn.query(sql, [no], (err, res) => {
   
            if (err) {
   
                // console.log('-----------error---------');
                // console.error(err);
                callback(undefined);
            } else {
   
                // console.log('------------success------------');
                // console.log(res);
                callback(res);
            }
        })
    } catch (error) {
   

    }
}
/* ...... */
// 修改方法，被删除的方法不展示给用户
function getMessage(callback) {
   
    let sql = "select * from ( SELECT * FROM message where deleted=0 order by no desc limit 50) as tmp order by no ;"
    try {
   
        conn.query(sql, (err, res) => {
   
            if (err) {
   
                // console.log('-----------error---------');
                // console.error(err);
                callback(undefined);
            } else {
   
                // console.log('------------success------------');
                // console.log(res);
                callback(res);
            }
        })
    } catch (error) {
   

    }
}
// 同理
function getMessageByNo(no, callback) {
   
    let sql = "select * from message where no=? and deleted != 1;"
    try {
   
        conn.query(sql, [no], (err, res) => {
   
            if (err) {
   
                // console.log('-----------error---------');
                // console.error(err);
                callback(undefined);
            } else {
   
                // console.log('------------success------------');
                // console.log(res);
                callback(res);
            }
        })
    } catch (error) {
   

    }
}

修改ws.js

/* ...... */
// 引入jsonwebtoken