使用 Nodejs 和 MongoDB 的注册表单(1)

📌 相关文章

📜 使用 Nodejs 和 MongoDB 的注册表单(1)

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

使用 Node.js 和 MongoDB 的注册表单

本文将介绍如何使用 Node.js 和 MongoDB 创建一个注册表单。

简介

在本文中，我们将使用以下技术：

Express.js：一个 Node.js web 框架。
MongoDB：一个流行的 NoSQL 数据库，用于存储用户数据。
Mongoose：一个 MongoDB 的对象模型工具。
HTML 和 CSS：用于创建前端表单。

步骤

步骤1：安装依赖

首先，我们需要在本地安装 Node.js 和 MongoDB。接着，我们将用以下命令在项目目录下安装需要的依赖：

npm install express mongoose body-parser

步骤2：创建 MongoDB 数据库

如果你还没有在本地安装 MongoDB，请先下载并安装。完成安装后，打开终端并键入以下命令：

mongo

接着，我们将创建一个名为 users 的数据库。

use users

这会创建一个新的数据库。下一步，我们将创建一个名为 usersData 的 collection。

db.createCollection("usersData")

步骤3：创建后端代码

首先，我们将在项目的根目录下创建一个 app.js 文件。在文件中，我们需要包含所需的模块和中间件，并启动服务器。

以下是在 app.js 文件中需要执行的步骤：

启动服务器。运行服务器将监听在端口 3000 上。
使用 body-parser 中间件来解析 POST 请求体。
定义路由和控制器。

下面是实现这些步骤的代码：

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

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

const app = express();

app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static('public'));

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/index.html');
});

const userSchema = new mongoose.Schema({
  email: String,
  password: String
});

const User = mongoose.model('User', userSchema);

app.post('/register', (req, res) => {
  const { email, password } = req.body;
  const user = new User({ email, password });
  user.save((err) => {
    if (err) {
      console.log(err);
      res.send('Error');
    } else {
      res.send('Success');
    }
  });
});

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

上面的代码执行以下步骤：

连接到 users 数据库。
启动服务器并开始监听端口 3000 上的请求。
解析 POST 请求体。
设置路由。
创建 User 模型。
在 /register 路径上处理 POST 请求并将用户信息存储到 MongoDB 数据库中。

步骤4：创建前端代码

在项目的根目录下，我们需要创建一个 public 文件夹。在该文件夹内，我们需要创建一个 HTML 表单，让用户输入他们的邮箱和密码。

以下是实现这些步骤的代码：

<!DOCTYPE html>
<html>
<head>
  <title>Registration Form</title>
</head>

<body>
  <h1>Registration Form</h1>

  <form method="post" action="/register">
    <p>
      <label>Email:</label>
      <input type="email" name="email" required>
    </p>
    <p>
      <label>Password:</label>
      <input type="password" name="password" required>
    </p>
    <p>
      <button type="submit">Submit</button>
    </p>
  </form>
</body>
</html>

上面的代码将创建一个带有两个输入框的表单，用于输入邮箱和密码，以及一个提交按钮。当用户提交表单时，将向 /register 路径发送 POST 请求。

步骤5：测试运行

现在，你已经完成了所有步骤。打开终端，并在项目目录下执行以下命令：

node app.js

现在，你可以通过访问 http://localhost:3000 来在浏览器中运行应用程序，这将打开一个带有注册表单的网页。

填写表单并提交后，你应该可以在 MongoDB 中看到新的用户数据。

总结

本文介绍了如何使用 Node.js 和 MongoDB 来创建一个注册表单。我们的示例程序包括一个后端和一个前端，它们都可以让用户输入注册信息并将其存储在数据库中。

现在，你已经学会了如何使用 Node.js 和 MongoDB 来创建表单，你可以根据需要对表单进行修改和扩展。