본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


Node.js/Nestjs (Nest.js)

Nestjs 프레임워크 서버(세션) -8

야근없는 행복한 삶을 위해 ~
by 마샤와 곰 2022. 8. 19.

#세션(Session)


세션은 서버에서 사용자의 정보를 담을 수 있는 저장공간 입니다.
nestjs에서도 다른 프레임워크와 마찬가지로 이러한 세션을 제공 합니다.
Nestjs에서 세션을 사용하기 위해서는 아래와 같이 추가 모듈을 설치해야 합니다.


npm i express-session 
npm i -D @types/express-session 

 

가끔 볼 수 있는 패키지인 @types 으로 시작하는 모듈(라이브러리)은 개발시 필요한 기능 입니다.
대부분의 npm 모듈은 Type에 대한 정의를 포함하고 있지 않기 때문에 타입스크립트 기반으로 개발된 라이브러리에 대해서 코멘트나 정의를 볼 수가 없습니다.
그래서 이러한 @types로 시작되는 모듈을 추가 설치하여 개발시에 유용하게 사용됩니다.
* 그래서 @types로 시작되는 모듈은 대부분 package.json에서 devDependencies 항목에 존재 합니다.
* 참고 : https://codeburst.io/https-chidume-nnamdi-com-npm-module-in-typescript-12b3b22f0724


첫번째 설정은 설치한 세션모듈이 어플리케이션에서 동작하게 만드는 것 입니다.
이를위해서 메인파일에 아래와 같은 코드를 추가하여 줍니다.

* 파일이름 : main.ts

import { NestFactory } from '@nestjs/core';
import { NestExpressApplication } from '@nestjs/platform-express';
import { AppModule } from './app.module';
import * as session from 'express-session'; //나 세션~

async function bootstrap() {
  const app = await NestFactory.create<NestExpressApplication>(AppModule);
  app.use(
    session({
      secret: 'MY_SESSION_ID',  //세션아이디
      resave: false,  //세션이 수정되지 않아도 지속적으로 저장하게 하는 옵션
      saveUninitialized: false,  //초기화되지 않는 세션을 저장하게 함
    }),
  );  
  await app.listen(3000);
}
bootstrap();

 

앱에서 세션을 설정하게 하려면 npm으로 설치한 session 라이브러리를 가져와 위 예제처럼 넣어줍니다.
옵션은 3가지를 줄 수 있습니다.
resave 옵션과 saveUninitialized 옵션은 기본적으로 false로 할 것을 권장하고 있습니다.

다음으로 세션을 사용하는 방법 입니다.
세션은 Request 객체로부터 받아와 사용 할 수 있습니다.
* 파일이름 : app.controller.ts

import { Request, Response } from 'express';
import { Controller, All, Res, Req, HttpStatus } from '@nestjs/common';
import { AppService } from './app.service';

@Controller()
export class AppController {

  constructor(private readonly appService: AppService) {}

  @All('initSession')
  세션설정(@Req() req: Request, @Res() res: Response): void {
    let session : any = req.session;
    session.number = 1234;  //사용자가 정의한 임의의 지정 값1
    session.string = 'abcd';   //사용자가 정의한 임의의 지정 값2
    session.object = {array:[1,2,3,4], str : 'good'};   //사용자가 정의한 임의의 지정 값3
    session.cookie.maxAge = 1000 * 10;  //만료시간
    res.status(HttpStatus.OK).send({ init : session != undefined });
  }

}


세션 사용법은 어렵지 않습니다. 
위 코드처럼 세션에는 어떠한 객체도 대입이 가능합니다. 
다만 Request에서의 세션에 직접 접근하여 대입하는 경우에 속성이 없다고 타입오류(경고)가 발생 할 수 있습니다.

@All('initSession')
세션설정(@Req() req: Request, @Res() res: Response): void {

    req.session.number = 1234; //number라는 속성을 찾을 수 없다고 컴파일단계에서 경고함(빨강줄...)
    
    let session : any = req.session;  //  any라는 타입을 지정해서 아래와 같이 대입하면
    session.number = 1234;  //오류가 나지 않음!!
    
}

 

사용방법 또한 무척 쉽습니다.
Request객체에서 session을 호출해서 원하는 값을 사용하면 됩니다.

* 파일이름 : app.controller.ts

import { Request, Response } from 'express';
import { Controller, All, Res, Req, HttpStatus } from '@nestjs/common';
import { AppService } from './app.service';

@Controller()
export class AppController {

  constructor(private readonly appService: AppService) {}

  @All('initSession')
  세션설정(@Req() req: Request, @Res() res: Response): void {
    let session : any = req.session;
    session.number = 1234;
    session.string = 'abcd';
    session.object = {array:[1,2,3,4], str : 'good'};   
    session.cookie.maxAge = 1000 * 10;
    res.status(HttpStatus.OK).send({ init : session != undefined });
  }

  @All('showSession')
  세션보기(@Req() req: Request, @Res() res: Response): void {
    let session : any = req.session;
    console.log(session)
    res.status(HttpStatus.OK).send({ yourSession: session });
  }  

}

 

실제 동작하는 모습입니다.
initSession 주소로 이동하여 세션에 정보를 넣어준 뒤 showSession 주소로 이동하여 보았습니다.

역시 NESTJS! 파싱한번 알아서 잘 해주네요...^-^

 

nestjs에서 훌륭하게도 알아서 객체를 이쁘게 매핑해 주는 것을 볼 수 있습니다.
그리고 세션페이지에 만료기능인 maxAge를 넣어 주었기 때문에 해당 세션은 10초뒤에 만료가 됩니다.

만료!

 

세션을 활용하면 로그인과 관련된 정보를 저장해서 사용 할 수 있을 것 입니다!

Nestjs에서 프레임워크(모듈) 기반의 로그인 기능을 쉽게 구현하려면 passport라는 모듈(프레임워크)에 대해서 소개하고 있습니다.
패스포트(여권)는 자바에서의 시큐리티(security), 파이썬의 플라스크로그인(flask-login) 과 비슷한 로그인 관련 모듈(프레임워크)입니다.

 

이러한 로그인과 관련된 모듈(프레임워크)을 사용하는 이유는 생산성과 유지보수에 목적이 있습니다.

다른 프로젝트에 투입되거나 신규 프로젝트를 진행하는 경우에 약속된 규칙과 잘 만들어진 정의문서(document)가 존재 한 다면 이러한 기능에 대한 협의시간을 줄일 수 있기 때문 입니다.

 

위 내용에  사용된 소스코드는 제 깃허브 페이지에서 확인 할 수 있습니다.

https://github.com/TaeSeungRyu/NestProject/tree/main/step7

 

GitHub - TaeSeungRyu/NestProject: Nestjs 프로젝트

Nestjs 프로젝트. Contribute to TaeSeungRyu/NestProject development by creating an account on GitHub.

github.com


공부하면 할 수록 재미있고 즐거운 nestjs!!!
다음 포스팅에서는 passport에 대해서 살펴보겠습니다.
궁금한점 또는 틀린부분은 언제든 연락 주세요!

 

반응형
* 위 에니메이션은 Html의 캔버스(canvas)기반으로 동작하는 기능 입니다. Html 캔버스 튜토리얼 도 한번 살펴보세요~ :)
* 직접 만든 Html 캔버스 애니메이션 도 한번 살펴보세요~ :)

댓글