使用 ExpressJS 和 MongoDB (TypeScript) 实现 CRUD 操作

介绍

作为一个后端开发人员，您可能希望了解如何存储和检索 API 与之交互的数据库中的数据。学习这一切可能会让人感到有些不知所措，但在本文中，我将向您展示如何编写一个 CRUD 操作的 API。在我们动手之前，先简要了解一些相关术语。

什么是 API？

API（应用程序编程接口）的全称是 Application Program Interface。API 就是一个可以被应用程序用来与服务进行通信的接口。例如，您的手机应用程序需要连接到某个服务来获取信息，通常该服务可能并不是用您手机应用程序相同的语言编写的，因此需要一个接口，您的手机应用程序通过这个接口与服务进行交互，使服务能够理解手机应用程序的请求。这个接口就是 API，而您的手机应用程序就是尝试与该服务接口进行交互的程序。

什么是后端？

后端包括 API、数据库、负载均衡器、进程管理器和其他技术，这些技术使得服务能够实现或增强其功能。

什么是 RESTful API？

RESTful（表述性状态转移）是一种确保与使用它的程序进行无状态交互的 API 类型。

举个例子：在现实生活中，无状态的交易可以类比于您在办公室忘带 ID 卡的情况，如果您没有出示 ID 卡，尽管门卫知道您是员工，也不会让您进入。而即使您带着 ID 卡出去了一分钟，再回来时，仍然需要出示 ID 卡才能进入。

这就是 RESTful API 的工作方式。它们不会保存关于您与它们之前交互的任何上下文或记录，您发送请求后，API 会返回响应，连接会关闭。当下一个请求到达时，它会被视为一个新的请求（程序与服务器之间建立新连接，并在服务器返回响应后关闭连接）。

数据库

数据库就是一个专门用于永久存储信息的服务器，除非信息被删除。您的 API 不能永久保存信息，因此需要一个地方来存储数据，这就是数据库的作用。

MongoDB

MongoDB 是源自 "humongous"（巨大）的词汇，反映了它处理大量数据的能力。它是一个无模式数据库，意味着您可以根据需要存储数据。

Mongoose

您还可以使用 Mongoose 这样的 ODM（对象文档映射器）来创建和应用应用程序级别的模式。MongoDB 将数据存储为文档，文档组成集合，而 Mongoose 是一个 ODM，使开发人员能够查询 MongoDB 并维护与数据库交互的模式。

CRUD 操作

CRUD 代表创建（Create）、读取（Read）、更新（Update）和删除（Delete）。这些是您作为后端开发人员常见的基本操作。

ExpressJS

ExpressJS 是一个框架，旨在使开发人员能够轻松构建 API。

开始设置

第 1 步：初始化项目/包

通过运行以下命令来初始化项目：

npm init -y

这将创建一个 package.json 文件，npm 用它来管理您的项目依赖项。

第 2 步：安装必要的依赖项

安装 morgan、express、mongoose、cors 和 nodemon，同时安装 typescript：

npm install morgan cors nodemon typescript mongoose express

还需要为 morgan 安装类型定义：

npm i --save-dev @types/morgan @types/express @types/cors

然后初始化项目中的 TypeScript：

tsc --init

第 3 步：创建项目所需的文件

在您的项目根目录（即 package.json 文件所在的文件夹）中创建以下文件：index.ts、crud.ts 和 crudModel.ts。

index.ts 文件是服务启动时第一个执行的文件。
crud.ts 文件将存储所有路由和控制器，供用户发起请求使用。
crudModel.ts 文件将用于存储与集合记录相关的数据一致性约束模式。

第 4 步：粘贴代码到 index.ts 文件

import express, { Application } from "express";
import mongoose from "mongoose";
import logger from "morgan";
import cors from "cors";
import crudRoutes from "./crud";

const app: Application = express();

mongoose.connect("mongodb://localhost:27017/crud").then(() => {
    console.log("Connected to database");
}).catch((error) => {
    console.log("Error:", error);
});

app.use(logger("dev"));
app.use(cors({ origin: "*" }));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use("/crud", crudRoutes);

app.use(function (req, res, next) {
    res.status(404).send({
        message: "Route not found"
    });
});

app.listen(4000, () => {
    console.log("The server is up...");
});

第 5 步：粘贴代码到 crud.ts 文件

import { Router, Request, Response } from "express";
import { contactsCollection } from "./crudModel";

const routes = Router();

// 创建联系人
routes.post("/contact", async (req: Request, res: Response) => {
    const { fullName, phoneNumber } = req.body;
    const contact = await contactsCollection.create({ fullName, phoneNumber });
    res.status(201).send({
        message: "New contact created successfully",
        data: contact
    });
});

// 获取所有联系人
routes.get("/contacts", async (req: Request, res: Response) => {
    const contact = await contactsCollection.find({});
    res.send({
        message: "All contacts retrieved successfully",
        data: contact
    });
});

// 获取单个联系人
routes.get("/contacts/:id", async (req: Request, res: Response) => {
    const { id } = req.params;
    const contact = await contactsCollection.findById(id);
    res.send({
        message: "Contact retrieved successfully",
        data: contact
    });
});

// 更新联系人
routes.put("/contacts/:id", async (req: Request, res: Response) => {
    const { id } = req.params;
    const { fullName, phoneNumber } = req.body;
    const contact = await contactsCollection.findByIdAndUpdate(id, { fullName, phoneNumber }, { new: true });
    res.send({
        message: "Contact updated successfully",
        data: contact
    });
});

// 删除联系人
routes.delete("/contacts/:id", async (req: Request, res: Response) => {
    const { id } = req.params;
    const contact = await contactsCollection.findByIdAndDelete(id);
    res.send({
        message: "Contact deleted successfully",
        data: contact
    });
});

export default routes;

第 6 步：粘贴代码到 crudModel.ts 文件

import { Schema, model } from "mongoose";

const myContactsSchema = new Schema({
    fullName: {
        type: String,
        required: true
    },
    phoneNumber: {
        type: String,
        required: true
    }
}, { timestamps: true });

const contactsCollection = model("contacts", myContactsSchema);

export {
    contactsCollection
};

第 7 步：修改 package.json 文件

"scripts": {
  "start": "nodemon index.js"
}

第 8 步：安装 Rest Client 扩展

安装 Rest Client 扩展来测试 API。

第 9 步：运行服务器

打开终端并运行 npm start。服务器将自动启动。

第 10 步：测试 API

您可以使用 Postman 测试 API，或者使用 Rest Client。在根目录中创建一个 test.rest 文件并粘贴以下内容：

POST http://localhost:4000/crud/contact
Content-Type: application/json

{
    "fullName": "Jimmy Wire Wire",
    "phoneNumber": "081122222211111"
}

###

GET http://localhost:4000/crud/contacts
Content-Type: application/json

###

GET http://localhost:4000/crud/contacts/676f654d7872dbd2f49aee48
Content-Type: application/json

###

PUT http://localhost:4000/crud/contacts/676f654d7872dbd2f49aee48
Content-Type: application/json

{
    "fullName": "Victor Ukok",
    "phoneNumber": "0811111111211"
}

###

PATCH http://localhost:4000/crud/contacts/676f654d7872dbd2f49aee48
Content-Type: application/json

{
    "fullName": "Victor Ukok edited"
}

###

DELETE http://localhost:4000/crud/contacts/676f6638b3383ee1f50955f1

使用 ExpressJS 和 MongoDB (TypeScript) 实现 CRUD 操作

介绍

什么是 API？

什么是后端？

什么是 RESTful API？

数据库

MongoDB

Mongoose

CRUD 操作

ExpressJS

开始设置

siddhan

评论(0)

后端架构师技术图谱

Vue3+vite 配置Eslint和Prettier

还在用 rollup 打包库？试试 unbuild 吧

使用 ExpressJS 和 MongoDB (TypeScript) 实现 CRUD 操作

介绍

什么是 API？

什么是后端？

什么是 RESTful API？

数据库

MongoDB

Mongoose

CRUD 操作

ExpressJS

开始设置

siddhan

评论(0)

相关阅读

Vue3+TypeScript+Vuetify+Vite 实现动态主题切换

TypeScript 5装饰器快速指南

Typescript 5.0 发布：快速概览

Go语言Clean Architecture

使用 Monaco 构建代码编辑器

TypeScript vs JSDoc: 什么是更好的类型检查工具？

一文理解REST API及如何编写REST API

后端架构师技术图谱

Vue3+vite 配置Eslint和Prettier

还在用 rollup 打包库？试试 unbuild 吧