📌  相关文章
📜  如何使用 TypeScript 通过 Express 构建 Node API?

📅  最后修改于: 2022-05-13 01:56:56.862000             🧑  作者: Mango

如何使用 TypeScript 通过 Express 构建 Node API?

在本文中,我们将讨论如何在 TypeScript 中创建 Express Route 和 API,并帮助我们使用默认的类型检查机制。我们将在带有 ExpressJS 配置的 TypeScript 的帮助下创建一些 Fake API 端点,并了解如何在我们的 ExpressJS 项目中使用 TypeScript。

TypeScript 是 JavaScript 的超集,具有一些 JavaScript 没有的附加功能,例如类型符号和静态类型更改或在旧代码库中使用 es6 的代码。打字稿提供了所有功能。如果您想使用 NodeJS 使用 express 使用 typescript 创建 API 服务,您必须首先使用 typescript 设置您的项目。如果您不知道如何在 typescript 中设置 express,请参阅本文。

我希望你已经使用上面的文章使用 typescript 设置了你的 express 项目,现在我们将开始在 Typescript 中创建我们的第一个 API。

先决条件:

  • Node.js 的基础知识。
  • Express Js 及其路由管理技术的基础知识。
  • 关于 TypeScript 及其用途的基本知识。

方法:根据上述文章设置目录结构。使用 TypeScript 启动 ExpressJ。将创建两个伪 API 来创建用户并使用 ExpressJs TypeScript 配置获取用户数据。查看最终的代码库文件。将在 Postman API 测试工具的帮助下测试我们的 API 端点并查看我们的 API 输出。



第一步:如果你在使用上面文章中设置的项目你的目录是这样的。

第 2 步:打开 index.ts 文件并编写以下代码。首先,在 TypeScript 中创建 ExpressJs 代码并遵循良好实践。

索引.js

Javascript
// Import the express with express name
import express from 'express';
  
// Initialize the express module with app variable
const app: express.Application = express();
  
// Define the port for the application is run
const port: number = 3000;
  
// Handle the comming data.
app.use(express.json());
  
// Handle '/', path of the api.
app.get('/', (_req, _res): void => {
    _res.json({
        'name': 'typescitp_api',
        'path': '/',
        'work': 'search_other_apis'
    });
});
  
  
// Server the api endpints.
app.listen(port, (): void => {
    console.log(`Typescript API server http://localhost:${port}/`);
});


Javascript
// Handle '/create', path for create user
app.post('/create', (_req, _res): void => {
  
    // Fatched the user using body data
    const user: object = _req.body;
  
    // Asigen the user in fake_db with id as a index
    fake_db.push(user);
  
    _res.json({
        "success": true,
        "data": user
    });
});


index.js
// Handle '/users', path for fatch users.
app.get('/users', (_req, _res): void => {
    _res.json({
        "success": true,
        "users": fake_db 
    });
})


index.js
// Import the express with express name
import express from 'express';
  
// Initialize the express module with app variable
const app: express.Application = express();
  
// Define the port for the application are run
const port: number = 3000;
  
// Handle the comming data
app.use(express.json());
  
// Handle '/', path of the api
app.get('/', (_req, _res): void => {
    _res.json({
        'name': 'typescitp_api',
        'path': '/',
        'work': 'search_other_apis'
    });
});
  
// A globle Object treat as a fake database
let fake_db: any = [];
  
// Handle '/create', path for create user
app.post('/create', (_req, _res): void => {
  
    // Fatched the user using body data
    const user: object = _req.body;
  
    // Asigen the user in fake_db with
    // id as a index
    fake_db.push(user);
  
    _res.json({
        "success": true,
        "data": user
    });
});
  
// Handle '/users', path for fatch users
app.get('/users', (_req, _res): void => {
    _res.json({
        "success": true,
        "users": fake_db
    });
})
  
// Serve the api endpints
app.listen(port, (): void => {
    console.log(
`Typescript API server http://localhost:${port}/`);
});


第 3 步:在这一步中,我们创建了两个 API 端点,用于创建用户和获取用户数据。首先创建一个全局数组作为假数据库处理。

句法:

let fake_db: any = [];

然后创建第一个 API 端点来创建用户并将用户数据存储在假数据库中。我们正在使用 API 端点,因此数据通过 post 方法或 JSON 数据格式传递。在下面的代码中,我们首先处理一个 post 请求并创建一个“/create”路由管理或创建用户 API 端点,然后将即将到来的正文数据分配给我们的假数据库并返回适当的输出。



索引.js

Javascript

// Handle '/create', path for create user
app.post('/create', (_req, _res): void => {
  
    // Fatched the user using body data
    const user: object = _req.body;
  
    // Asigen the user in fake_db with id as a index
    fake_db.push(user);
  
    _res.json({
        "success": true,
        "data": user
    });
});

第 4 步:第二个 API 仅显示数组数据。在简单的获取请求中。这里我们只以 JSON 格式返回我们的虚拟数据库。

索引.js

// Handle '/users', path for fatch users.
app.get('/users', (_req, _res): void => {
    _res.json({
        "success": true,
        "users": fake_db 
    });
})

运行应用程序的步骤:创建两个 API 后,导航 index.ts 路径并在终端上使用以下命令运行服务器。

npm start

最终代码库:以上所有代码只是为了展示如何创建路由,这是包含上述所有代码的最终 index.js 文件。

索引.js

// Import the express with express name
import express from 'express';
  
// Initialize the express module with app variable
const app: express.Application = express();
  
// Define the port for the application are run
const port: number = 3000;
  
// Handle the comming data
app.use(express.json());
  
// Handle '/', path of the api
app.get('/', (_req, _res): void => {
    _res.json({
        'name': 'typescitp_api',
        'path': '/',
        'work': 'search_other_apis'
    });
});
  
// A globle Object treat as a fake database
let fake_db: any = [];
  
// Handle '/create', path for create user
app.post('/create', (_req, _res): void => {
  
    // Fatched the user using body data
    const user: object = _req.body;
  
    // Asigen the user in fake_db with
    // id as a index
    fake_db.push(user);
  
    _res.json({
        "success": true,
        "data": user
    });
});
  
// Handle '/users', path for fatch users
app.get('/users', (_req, _res): void => {
    _res.json({
        "success": true,
        "users": fake_db
    });
})
  
// Serve the api endpints
app.listen(port, (): void => {
    console.log(
`Typescript API server http://localhost:${port}/`);
});

写完所有代码后,进入测试阶段,看看我们的 API 输出了什么。

第 5 步:现在最后一步是使用 Postman 测试所有创建的路由。如果您不了解邮递员,请参阅本文。



1.使用邮递员测试'/'根路径。

根路径工作正常,所以我们正在移动到另一个 API 端点。

2. 使用 postman 测试 post 请求中的“/create”路径。

我们直接传递原始 JSON 数据。

3. 使用邮递员测试“/users”路径。