📜  如何从 Node、express 和 Mongoose 和 Ajax 上的帖子中删除评论 - Javascript (1)

📅  最后修改于: 2023-12-03 15:08:14.402000             🧑  作者: Mango

如何从 Node、Express 和 Mongoose 和 Ajax 上的帖子中删除评论 - JavaScript

在这篇文章中,我们将介绍如何使用 Node.js、Express.js 和 Mongoose 以及 Ajax 从帖子中删除评论。如果你是初学者,可能需要对这些工具都具有基本的了解。如果你已经熟悉这些工具,那么我们开始学习。

准备

在开始之前,我们需要安装 Node.js、MongoDB,并创建一个名为 blog 的数据库。安装完成后,我们需要用 NPM 安装以下依赖项:

  • Express.js
  • Mongoose
  • Body-parser
  • Nodemon

你可以在终端中使用以下命令:

npm install express mongoose body-parser nodemon --save
创建模型

我们需要创建一个模型,用于存储我们的帖子和评论。打开一个新的文件,在其中编写以下代码:

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

const CommentSchema = new Schema({
    text: String,
    author: String
});

const PostSchema = new Schema({
    title: String,
    content: String,
    author: String,
    comments: [CommentSchema]
});

const Post = mongoose.model('Post', PostSchema);

module.exports = Post;

在这段代码中,我们定义了两个模型,一个是用于存储评论,另一个是用于存储帖子。我们将评论作为嵌套模型存储在帖子模型中。

编写路由

现在,我们需要编写路由,用于处理删除评论的请求。在目录中创建一个新文件夹 routes,并创建一个新文件 posts.js。在其中编写以下代码:

const express = require('express');
const router = express.Router();
const Post = require('../models/post');

router.delete('/:postId/comments/:commentId', (req, res, next) => {

    Post.findById(req.params.postId)
        .then((post) => {

            const comment = post.comments.id(req.params.commentId);
            comment.remove();

            post.save()
                .then(() => {
                    res.status(200).send({
                        message: 'Comment deleted successfully'
                    });
                })
                .catch((err) => {
                    console.log(err);
                    res.status(500).send({
                        error: err
                    });
                });

        })
        .catch((err) => {
            console.log(err);
            res.status(500).send({
                error: err
            });
        });

});

module.exports = router;

我们定义了一个路由,用于处理删除评论的请求。在该路由中,我们首先通过 postId 参数查找帖子,然后找到所需删除的评论,并使用 remove() 方法将其从帖子模型中移除。最后,我们保存模型并发送成功消息或错误消息。

更新主要的路由

现在,我们需要更新我们的主要路由,以便能够访问我们的新路由。在目录中创建一个新文件 app.js,并编写以下代码:

const express = require('express');
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const app = express();

// Route to handle delete comment request
const postsRoutes = require('./routes/posts');
app.use('/posts', postsRoutes);

// MongoDB Connection
mongoose.connect('mongodb://localhost:27017/blog', { useNewUrlParser: true })
    .then(() => {
        console.log('MongoDB Connected')
    })
    .catch((err) => console.log(err));

// Body-parser Middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

// Define Port
const port = process.env.PORT || 5000;

// Start Server
app.listen(port, () => console.log(`Server started on port ${port}`));

在这段代码中,我们首先引入必要的依赖项。然后,我们定义了一个路由,用于处理删除评论的请求。我们还使用 mongoose 来连接数据库,使用 body-parser 来解析请求正文。最后,我们定义了启动服务器的端口。

客户端代码

现在,我们需要编写客户端代码,使用 AJAX 发送请求以删除评论。在 HTML 中添加以下代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Delete Comment Demo</title>
</head>

<body>
    <h1>Delete Comment</h1>
    <ul id="comments"></ul>

    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

    <script>
        $.ajax({
            method: "DELETE",
            url: "http://localhost:5000/posts/5c7f2d13d075ba7b909e148e/comments/5c7f2d13d075ba7b909e1490",
            success: function(data) {
                alert(data.message);
            },
            error: function(err) {
                console.log(err);
            }
        });
    </script>
</body>

</html>

在上面的代码中,我们使用 AJAX 向服务器发送删除请求。我们需要替换 URL,以便它指向正确的帖子 ID 和评论 ID。

完成

现在,我们已经接近成功。在终端中启动服务器,打开我们的 HTML 文件,然后单击“删除评论”按钮,该评论将从评论列表中删除。

这就是从 Node、Express 和 Mongoose 中删除评论所需的全部步骤。

最后附上markdown
# 如何从 Node、Express 和 Mongoose 和 Ajax 上的帖子中删除评论 - JavaScript

## 准备

在开始之前,我们需要安装 Node.js、MongoDB,并创建一个名为 `blog` 的数据库。安装完成后,我们需要用 NPM 安装以下依赖项:

- Express.js
- Mongoose
- Body-parser
- Nodemon

## 创建模型

我们需要创建一个模型,用于存储我们的帖子和评论。打开一个新的文件,在其中编写以下代码:

```javascript
const mongoose = require('mongoose');
const Schema = mongoose.Schema;

const CommentSchema = new Schema({
    text: String,
    author: String
});

const PostSchema = new Schema({
    title: String,
    content: String,
    author: String,
    comments: [CommentSchema]
});

const Post = mongoose.model('Post', PostSchema);

module.exports = Post;
编写路由

现在,我们需要编写路由,用于处理删除评论的请求。在目录中创建一个新文件夹 routes,并创建一个新文件 posts.js。在其中编写以下代码:

const express = require('express');
const router = express.Router();
const Post = require('../models/post');

router.delete('/:postId/comments/:commentId', (req, res, next) => {

    Post.findById(req.params.postId)
        .then((post) => {

            const comment = post.comments.id(req.params.commentId);
            comment.remove();

            post.save()
                .then(() => {
                    res.status(200).send({
                        message: 'Comment deleted successfully'
                    });
                })
                .catch((err) => {
                    console.log(err);
                    res.status(500).send({
                        error: err
                    });
                });

        })
        .catch((err) => {
            console.log(err);
            res.status(500).send({
                error: err
            });
        });

});

module.exports = router;
更新主要的路由

现在,我们需要更新我们的主要路由,以便能够访问我们的新路由。在目录中创建一个新文件 app.js,并编写以下代码:

const express = require('express');
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const app = express();

// Route to handle delete comment request
const postsRoutes = require('./routes/posts');
app.use('/posts', postsRoutes);

// MongoDB Connection
mongoose.connect('mongodb://localhost:27017/blog', { useNewUrlParser: true })
    .then(() => {
        console.log('MongoDB Connected')
    })
    .catch((err) => console.log(err));

// Body-parser Middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

// Define Port
const port = process.env.PORT || 5000;

// Start Server
app.listen(port, () => console.log(`Server started on port ${port}`));
客户端代码

现在,我们需要编写客户端代码,使用 AJAX 发送请求以删除评论。在 HTML 中添加以下代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Delete Comment Demo</title>
</head>

<body>
    <h1>Delete Comment</h1>
    <ul id="comments"></ul>

    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

    <script>
        $.ajax({
            method: "DELETE",
            url: "http://localhost:5000/posts/5c7f2d13d075ba7b909e148e/comments/5c7f2d13d075ba7b909e1490",
            success: function(data) {
                alert(data.message);
            },
            error: function(err) {
                console.log(err);
            }
        });
    </script>
</body>

</html>
完成

现在,我们已经接近成功。在终端中启动服务器,打开我们的 HTML 文件,然后单击“删除评论”按钮,该评论将从评论列表中删除。

这就是从 Node、Express 和 Mongoose 中删除评论所需的全部步骤。