【前端】嘿，Nest.js实战开发系列之 Nest.js初体验

写在前面前面从小白视角学习了Typescript，并学习总结了ts的系列文章，希望能够对于读者有所帮助。至于学习了TS基础后，如何进行开发实践，本系列将结合Nest.js的Node服务器框架进行娓娓道来。

创新互联公司是一家专注于成都网站设计、成都网站建设与策划设计,旬阳网站建设哪家好?创新互联公司做网站,专注于网站建设十多年,网设计领域的专业建站公司;建站业务涵盖:旬阳等地区。旬阳做网站价格咨询:18980820575

  • Nest (NestJS) 是一个用于构建高效、可扩展的Node.js服务器端应用程序的框架。它使用渐进式 JavaScript，使用TypeScript构建并完全支持(但仍然允许开发人员使用纯 JavaScript 进行编码)并结合了 OOP(面向对象编程)、FP(函数式编程)和 FRP(函数式响应式编程)的元素。

Nest使用了功能强大的HTTP Server框架，默认支持Express框架，其是简单易上手的。Nest是在Express上进行抽象而成的，结合TS强大的语言体系实现高效快捷开发。

Nest是笔者继接触Express框架后感兴趣的Node框架，对此还是比较熟悉的，选择Nest也就简单易行。截止到笔者发布文章的时候，Github上Nest拥有37.7K个Stat，足以证明其受青睐程度。

Nest 提供开箱即用的应用程序架构，允许开发人员和团队创建高度可测试、可扩展、松散耦合且易于维护的应用程序。该架构深受 Angular 的启发。

项目创建

开发环境

在项目开展前，先行介绍下开发环境：

  • node.js：14.15.1
  • typescript：3.8.3
  • nest.js：7.6.15

先决条件请确保您的操作系统上安装了Node.js(>= 10.13.0，v13 除外)。

创建项目

要使用 Nest cli创建项目，先得安装相关脚手架，运行下列命令创建第一个Nest项目。

 
 
 
 
      
  
  
  
  1. $ npm i -g @nestjs/cli 
    2.   
  
  
  
  2. $ nest new project-name 
    3.

当然也可以使用yarn命令进行创建：

 
 
 
 
      
  
  
  
  1. $ yarn add @nest/cli 
    2.   
  
  
  
  2. $ nest new project-name 
    3.

在输入完上述命令后，得到以下内容：

 
 
 
 
      
  
  
  
  1. G:\Code>nest new nest-test 
    2.   
  
  
  
  2.   We will scaffold your app in a few seconds.. 
    3.   
  
  
  
  3.  
    4.   
  
  
  
  4. CREATE nest-test/.eslintrc.js (631 bytes) 
    5.   
  
  
  
  5. CREATE nest-test/.prettierrc (51 bytes) 
    6.   
  
  
  
  6. CREATE nest-test/nest-cli.json (64 bytes) 
    7.   
  
  
  
  7. CREATE nest-test/package.json (1971 bytes) 
    8.   
  
  
  
  8. CREATE nest-test/README.md (3339 bytes) 
    9.   
  
  
  
  9. CREATE nest-test/tsconfig.build.json (97 bytes) 
    10.   
  
  
  
  10. CREATE nest-test/tsconfig.json (339 bytes) 
    11.   
  
  
  
  11. CREATE nest-test/src/app.controller.spec.ts (617 bytes) 
    12.   
  
  
  
  12. CREATE nest-test/src/app.controller.ts (274 bytes) 
    13.   
  
  
  
  13. CREATE nest-test/src/app.module.ts (249 bytes) 
    14.   
  
  
  
  14. CREATE nest-test/src/app.service.ts (142 bytes) 
    15.   
  
  
  
  15. CREATE nest-test/src/main.ts (208 bytes) 
    16.   
  
  
  
  16. CREATE nest-test/test/app.e2e-spec.ts (630 bytes) 
    17.   
  
  
  
  17. CREATE nest-test/test/jest-e2e.json (183 bytes) 
    18.   
  
  
  
  18.  
    19.   
  
  
  
  19. ? Which package manager would you ️  to use? yarn 
    20.   
  
  
  
  20. ▹▹▹▸▹ Installation in progress...  
    21.

上述所示，会询问你选择yarn还是npm进行包管理，笔者此处选择的是yarn。

 
 
 
 
      
  
  
  
  1.   Successfully created project nest-test 
    2.   
  
  
  
  2.   Get started with the following commands: 
    3.   
  
  
  
  3.  
    4.   
  
  
  
  4. $ cd nest-test 
    5.   
  
  
  
  5. $ yarn run start 
    6.   
  
  
  
  6.  
    7.   
  
  
  
  7.  
    8.   
  
  
  
  8.                           Thanks for installing Nest  
    9.   
  
  
  
  9.                  Please consider donating to our open collective 
    10.   
  
  
  
  10.                         to help us maintain this package. 
    11.   
  
  
  
  11.  
    12.   
  
  
  
  12.  
    13.   
  
  
  
  13.                  Donate: https://opencollective.com/nest 
    14.

经历过岁月静好，电脑后台已经为我们负重前行，最终创建成功。

根据上述提示，我们进入项目进行操作，项目目录如下所示：

运行yarn start或npm run start后执行运行项目，启动项目服务。

此时，在浏览器地址栏输入http://localhost:3000即可看到hello world。

详情介绍

路由

当打开src目录下main.ts文件时，看到@Controller()装饰器中使用路由前缀可以更方便地进行路由分组，最大程度减少代码重复。

main.ts

 
 
 
 
      
  
  
  
  1. import { NestFactory } from '@nestjs/core'; 
    2.   
  
  
  
  2. import { AppModule } from './app.module'; 
    3.   
  
  
  
  3.  
    4.   
  
  
  
  4. async function bootstrap() { 
    5.   
  
  
  
  5.   const app = await NestFactory.create(AppModule);//表示使用nest的工厂函数创建了AppModule 
    6.   
  
  
  
  6.   await app.listen(3000);//表示项目监听的端口是3000 
    7.   
  
  
  
  7. } 
    8.   
  
  
  
  8. bootstrap(); 
    9.

控制器是控制传入的请求返回到客户端的显示内容，当然也可以进行添加指定的路由。我们可以在app.controller.ts文件中添加以下代码：

 
 
 
 
      
  
  
  
  1. @Get("/home") 
    2.   
  
  
  
  2. getHome(): string { 
    3.   
  
  
  
  3.   return "my home"; 
    4.   
  
  
  
  4. } 
    5.

运行得到：

设置局部路由前缀

路由还可以设置局部和全局的前缀，使用前缀可以避免在所有路由共享通用前缀时出现冲突的情况。

在@Controller()写入best，可以表示当前文件中所有路由设置前缀best。如下所示：

 
 
 
 
      
  
  
  
  1. @Controller("best") 
    2.   
  
  
  
  2. export class AppController { 
    3.   
  
  
  
  3.   constructor(private readonly appService: AppService) {} 
    4.   
  
  
  
  4.  
    5.   
  
  
  
  5.   @Get() 
    6.   
  
  
  
  6.   getHello(): string { 
    7.   
  
  
  
  7.     return this.appService.getHello(); 
    8.   
  
  
  
  8.   } 
    9.   
  
  
  
  9. } 
    10.

运行结果：

设置全局路由前缀

可以在main.ts文件中添加app.setGlobalPrefix()设置全局路由前端:

 
 
 
 
      
  
  
  
  1. app.setGlobalPrefix('nest-test'); // 全局路由前缀 
    2.

运行结果：

controller控制器

控制器负责处理传入的请求并将响应返回给客户端。控制器的目的是接收应用程序的特定请求。在路由该控制器接收哪些请求机构的控制。很多时候，每个控制器有多个路由，不同的路由可以执行不同的动作。

为创建一个基本的控制器，我们使用类和装饰器。装饰器将类与所需的元数据相关联，并使 Nest 能够创建路由映射(将请求绑定到相应的控制器)。

app.controller.ts

 
 
 
 
      
  
  
  
  1. import { Controller, Get } from '@nestjs/common'; 
    2.   
  
  
  
  2. import { AppService } from './app.service'; 
    3.   
  
  
  
  3.  
    4.   
  
  
  
  4. @Controller() 
    5.   
  
  
  
  5. export class AppController { 
    6.   
  
  
  
  6.   constructor(private readonly appService: AppService) {} 
    7.   
  
  
  
  7.  
    8.   
  
  
  
  8.   @Get() 
    9.   
  
  
  
  9.   getHello(): string { 
    10.   
  
  
  
  10.     return this.appService.getHello(); 
    11.   
  
  
  
  11.   } 
    12.   
  
  
  
  12. } 
    13.

同样的，我们可以使用命令进行创建新的控制器模块，便于对项目的管理。

 
 
 
 
      
  
  
  
  1. $ nest g controller users 
    2.

此时在src中生成了users目录文件：

初始化的controller文件如下：

users.controller.ts

 
 
 
 
      
  
  
  
  1. import { Controller } from '@nestjs/common'; 
    2.   
  
  
  
  2.  
    3.   
  
  
  
  3. @Controller('users') 
    4.   
  
  
  
  4. export class UsersController {} 
    5.

Services业务

我们看到前面controller文件中，可以实现简单业务逻辑的处理，但是在实际开发中应当将控制器和业务进行分开，对代码进行解耦。

 
 
 
 
      
  
  
  
  1. $ nest g service users 
    2.

此时在src中的users目录下生成了业务文件：

users.service.ts

 
 
 
 
      
  
  
  
  1. import { Injectable } from '@nestjs/common'; 
    2.   
  
  
  
  2.  
    3.   
  
  
  
  3. @Injectable() 
    4.   
  
  
  
  4. export class UsersService { 
    5.   
  
  
  
  5.   // 添加用户的业务逻辑 
    6.   
  
  
  
  6.   addUser(username: string, password: string): string{ 
    7.   
  
  
  
  7.     console.log(`create user：username--${username} password--${password}`); 
    8.   
  
  
  
  8.      
    9.   
  
  
  
  9.     return "add user success"; 
    10.   
  
  
  
  10.   } 
    11.   
  
  
  
  11. } 
    12.

users.controller.ts

 
 
 
 
      
  
  
  
  1. import { Body, Controller, Post } from '@nestjs/common'; 
    2.   
  
  
  
  2. import { UsersService }from "./users.service"; 
    3.   
  
  
  
  3. @Controller('users') 
    4.   
  
  
  
  4. export class UsersController { 
    5.   
  
  
  
  5.   constructor(private readonly usersService: UsersService) {}//Nest 是围绕通常称为依赖注入的强大设计模式构建的。Nest 将UsersService通过创建并返回一个实例usersService。 
    6.   
  
  
  
  6.    
    7.   
  
  
  
  7.   @Post("add") 
    8.   
  
  
  
  8.   addUser(@Body() body){ 
    9.   
  
  
  
  9.     return this.usersService.addUser(body.username,body.password); 
    10.   
  
  
  
  10.   } 
    11.   
  
  
  
  11. } 
    12.

使用postman进行模拟用户请求，运行结果如下：

Module模块

模块是用@Module()装饰器注释的类，@Module()装饰器提供元数据利用的组织应用程序结构。

每个应用程序至少有一个模块和一个根模块。根模块是 Nest 用于构建应用程序图的起点- Nest 用于解析模块和提供者关系和依赖关系的内部数据结构。虽然理论上非常小的应用程序可能只有根模块，但这不是典型情况。我们要强调的是，强烈推荐使用模块作为组织组件的有效方式。因此，对于大多数应用程序，最终的架构将采用多个模块，每个模块封装一组密切相关的功能。

所述@Module()装饰采用单个对象，其属性描述该模块：

我们看到上面创建的Service和Controller是如何进行访问运行的呢?

打开app.modelu.ts 可以看到：

 
 
 
 
      
  
  
  
  1. import { Module } from '@nestjs/common'; 
    2.   
  
  
  
  2. import { AppController } from './app.controller'; 
    3.   
  
  
  
  3. import { AppService } from './app.service'; 
    4.   
  
  
  
  4. import { UsersController } from './users/users.controller'; 
    5.   
  
  
  
  5. import { UsersService } from './users/users.service'; 
    6.   
  
  
  
  6.  
    7.   
  
  
  
  7. @Module({ 
    8.   
  
  
  
  8.   imports: [], 
    9.   
  
  
  
  9.   controllers: [AppController, UsersController], 
    10.   
  
  
  
  10.   providers: [AppService, UsersService], 
    11.   
  
  
  
  11. }) 
    12.   
  
  
  
  12. export class AppModule {} 
    13.

在我们创建了子模块后，创建了UsersController和UsersService，即使不新建module文件也能通过路由访问，因为系统会自动添加到app.module.ts文件中。

当然，我们也可以根据需求进行创建子模块的module文件,只需要执行下列命令即可：

 
 
 
 
      
  
  
  
  1. $ nest g module users 
    2.

此时看到生成了module子模块文件：

初始化的文件如下所示：

 
 
 
 
      
  
  
  
  1. import { Module } from '@nestjs/common'; 
    2.   
  
  
  
  2.  
    3.   
  
  
  
  3. @Module({}) 
    4.   
  
  
  
  4. export class UsersModule {} 
    5.

此时需要将users模块的UsersController和UsersService组装到module文件中。这样，其他module模块想要引入Users模块时，不需要同时Controller和Service了，方便对本模块进行管理。

 
 
 
 
      
  
  
  
  1. import { Module } from '@nestjs/common'; 
    2.   
  
  
  
  2. import { UsersController } from './users.controller'; 
    3.   
  
  
  
  3. import { UsersService } from './users.service'; 
    4.   
  
  
  
  4.  
    5.   
  
  
  
  5. @Module({ 
    6.   
  
  
  
  6.   imports: [UsersModule], 
    7.   
  
  
  
  7.   controllers: [UsersController], 
    8.   
  
  
  
  8.   providers: [UsersService], 
    9.   
  
  
  
  9. }) 
    10.   
  
  
  
  10. export class UsersModule {} 
    11.

当然，需要对app.module.ts文件进行修改，因为子模块已经引入了Controller和Service了。

 
 
 
 
      
  
  
  
  1. import { Module } from '@nestjs/common'; 
    2.   
  
  
  
  2. import { AppController } from './app.controller'; 
    3.   
  
  
  
  3. import { AppService } from './app.service'; 
    4.   
  
  
  
  4. // import { UsersController } from './users/users.controller'; 
    5.   
  
  
  
  5. // import { UsersService } from './users/users.service'; 
    6.   
  
  
  
  6. import { UsersModule } from './users/users.module'; 
    7.   
  
  
  
  7.  
    8.   
  
  
  
  8. @Module({ 
    9.   
  
  
  
  9.   imports: [UsersModule], 
    10.   
  
  
  
  10.   controllers: [AppController], 
    11.   
  
  
  
  11.   providers: [AppService], 
    12.   
  
  
  
  12. }) 
    13.   
  
  
  
  13. export class AppModule {} 
    14.

小结

本文主要介绍使用Nest创建的首个项目，简要讲解了创建过程，以及使用到的模块概念。对路由、控制器、业务、模块进行了阐述，后续概念会进行详细讲解，更详细的请见官方文档。

当前文章：【前端】嘿，Nest.js实战开发系列之 Nest.js初体验
文章来源：http://www.shufengxianlan.com/qtweb/news18/222668.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

服务器托管知识

行业网站建设

亮美家　　 　西云服务器托管　　 　全网营销网站推广　　 　外贸网站设计方案　　 　服务器租凭　　 　手机APP开发　　 　内江服务器托管　　 　西云机房　　 　圣月阀门　　 　网站seo优化　　 　手机APP开发　　 　成都气球装饰　　 　成都定制网站建设　　 　合江网站建设　　 　成都网站设计　　 　做网站　　 　全网营销　　 　恒温恒湿空调机组　　 　简阳网站建设　　 　成都网站推广