美文网首页@IT·互联网
nestjs返回给前端数据格式的封装

nestjs返回给前端数据格式的封装

作者: 春木橙云 | 来源:发表于2021-11-04 14:06 被阅读0次

返回数据格式处理,更方便前端使用,官方文档没找到,这里mark一下,以备后查~!

  • 返回数据处理前
  [
        {
            "id": 1,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星",
            "created_at": "2021-11-03T07:25:25.792Z",
            "updated_at": "2021-11-03T07:25:25.792Z"
        },
        {
            "id": 2,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星2",
            "created_at": "2021-11-03T08:37:59.332Z",
            "updated_at": "2021-11-03T08:37:59.332Z"
        },
        {
            "id": 3,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星2",
            "created_at": "2021-11-03T08:38:00.843Z",
            "updated_at": "2021-11-03T08:38:00.843Z"
        }
]
  • 返回数据处理后
 {
    "data": [
        {
            "id": 1,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星",
            "created_at": "2021-11-03T07:25:25.792Z",
            "updated_at": "2021-11-03T07:25:25.792Z"
        },
        {
            "id": 2,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星2",
            "created_at": "2021-11-03T08:37:59.332Z",
            "updated_at": "2021-11-03T08:37:59.332Z"
        },
        {
            "id": 3,
            "projectName": "test2",
            "status": 1,
            "Modifyer": "岁星2",
            "created_at": "2021-11-03T08:38:00.843Z",
            "updated_at": "2021-11-03T08:38:00.843Z"
        }
    ],
    "code": 200,
    "result": 1,
    "message": "请求成功"
}

失败拦截具体操作

1,使用命令创建一个过滤器

nest g f filters/httpException

2,过滤器的代码

import {
  ArgumentsHost,
  Catch,
  ExceptionFilter,
  HttpException,
  HttpStatus,
  Logger,
} from '@nestjs/common';

@Catch(HttpException)
export class HttpExceptionFilter implements ExceptionFilter {
  catch(exception: HttpException, host: ArgumentsHost) {
    const ctx = host.switchToHttp();
    const response = ctx.getResponse();
    const request = ctx.getRequest();

    const message = exception.message.message;
    Logger.log('错误提示', message);
    const errorResponse = {
      data: {
         error: message,
        }, // 获取全部的错误信息
      message: '请求失败',
      code: 1, // 自定义code
      url: request.originalUrl, // 错误的url地址
    };
    const status =
      exception instanceof HttpException
        ? exception.getStatus()
        : HttpStatus.INTERNAL_SERVER_ERROR;
    // 设置返回的状态码、请求头、发送错误信息
    response.status(status);
    response.header('Content-Type', 'application/json; charset=utf-8');
    response.send(errorResponse);
  }
}


3,在main.ts中全局注册(注意:要放在listen函数上面,否则不生效)

...
import { HttpExceptionFilter } from './filters/http-exception.filter';

async function bootstrap() {
  ...
  // 全局注册错误的过滤器
  app.useGlobalFilters(new HttpExceptionFilter());
}
bootstrap();

成功拦截具体操作

1,创建一个拦截器

nest g interceptor interceptor/transform

2,拦截器的代码

import {
  Injectable,
  NestInterceptor,
  CallHandler,
  ExecutionContext,
} from '@nestjs/common';
import { map } from 'rxjs/operators';
import { Observable } from 'rxjs';
interface Response<T> {
  data: T;
}
@Injectable()
export class TransformInterceptor<T>
  implements NestInterceptor<T, Response<T>> {
  intercept(
    context: ExecutionContext,
    next: CallHandler<T>,
  ): Observable<Response<T>> {
    return next.handle().pipe(
      map(data => {
        return {
          data,
          code: 0,
          message: '请求成功',
        };
      }),
    );
  }
}

4,全局注册(注意:要放在listen函数上面,否则不生效,以防你看不懂,整个文件贴在这里)

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { HttpExceptionFilter } from './filters/http-exception.filter';
import { TransformInterceptor } from './interceptor/transform.interceptor';
async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.useGlobalInterceptors(new TransformInterceptor());
  await app.useGlobalFilters(new HttpExceptionFilter());
  await app.listen(3000);
}
bootstrap();

THE END

相关文章

网友评论

    本文标题:nestjs返回给前端数据格式的封装

    本文链接:https://www.haomeiwen.com/subject/tuckzltx.html