CORS 와 Cookie

CORS

너무간단하게 main.ts 한줄만 추가해주면된다.

async function bootstrap() {
  const app = await NestFactory.create<NestExpressApplication>(AppModule);

  app.enableCors(); // 추가 및 config

  app.setBaseViewsDir(join(__dirname, '..', 'views'));
  app.setViewEngine('html');

  await app.listen(3030);
}
bootstrap();

 

하지만 쿠키를 사용하기 위해서는 wileCard가 안된다는 점과, credential header를 추가해주어야한다.

  app.enableCors({
    origin: 'http://localhost:3000',
    credentials: true,
  });

Cookie

npm i cookie-parser
npm i -D @types/cookie-parser

async function bootstrap() {
  const app = await NestFactory.create<NestExpressApplication>(AppModule);

  app.enableCors({
    origin: 'http://localhost:3000',
    credentials: true,
  });
  app.use(cookieParser()); // 추가

  app.setBaseViewsDir(join(__dirname, '..', 'views'));
  app.setViewEngine('html');

  await app.listen(3030);
}
bootstrap();

Set-Cookie

res 객체를 꺼내서 express 와 동일하게 해준다.

append('Set-Cookie') or cookie() 사용

passthrough:true 는 응답을 nest에게 여전히 위임한다는 의미이다.

  @Post('/login')
  login(@Res({ passthrough: true }) res: Response) {
    res.cookie('name', 'kong');
    return { res: 'logined!' };
  }

Cookie 읽기 - 커스텀 데코레이터

cookie-decorator.ts

import { createParamDecorator, ExecutionContext } from '@nestjs/common';

export const Cookies = createParamDecorator(
  (data: string, ctx: ExecutionContext) => {
    const request = ctx.switchToHttp().getRequest();
    return data ? request.cookies?.[data] : request.cookies;
  },
);

  @Get('/user')
  userInfo(@Cookies('name') name: string) {
    console.log(name);
    return { res: name };
  }