본문 바로가기
NestJS

[NestJS] 요즘 MZ들은 NGINX 대신 mkcert 쓴다.

by 개복취 2024. 2. 5.

 

0. 배경

1. SSL / TLS?

2. mkcert? Nginx?


배경

백엔드에서는 res.cookie를 통해 accessTokenrefreshToken을 넣어줬는데, 프론트엔드에서는 쿠키를 받지 못했다.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies

 

auth.controller.ts

res.cookie('accessToken', jwtAccessToken, {
      httpOnly: true,
      secure: true,
      sameSite: 'none',
      expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 7),
    });

 

  • SameSite=None으로 설정했는데 이 경우 Secure 옵션은 항상 true여야 한다.
  • localhost 에서 포트번호만 3000(BE), 8000(FE)로 다르게 해서 개발하고 있기 때문에 sameSite: 'none' 은 필수적이었다.
    따라서, secure: True 로 설정하고 https로 통신을 해야 한다.

SSL / TLS?

https://thecybersecurityman.com/2017/11/08/the-osi-model-quick-example/

 

HTTP 자체는 암호화되지 않아 데이터가 네트워크를 통해 전송될 때 제3자가 정보를 도청할 수 있는 위험이 있다. 이러한 취약점을 보완하기 위해, HTTP와 SSL/TLS를 결합한 것이 HTTPS(Hypertext Transfer Protocol Secure)이다.

MDN 에서의 https 정의
HTTPS (HTTP Secure) 는 HTTP protocol의 암호화된 버전이다. 이것은 대개 클라이언트와 서버 간의 모든 커뮤니케이션을 암호화 하기 위하여 SSL 이나 TLS을 사용한다. 이 커넥션은 클라이언트가 민감한 정보를 서버와 안전하게 주고받도록 해준다. 예를들면 금융 활동 이나 온라인 쇼핑이 있을 수 있다.

 

SSL 인증서는 클라이언트와 서버간의 통신을 제 3자가 보증해주는 전자화 된 문서이다. 이 3자에 해당되는것이 CA(Certificate Authority)이다. 참고로 도메인을 구매하는 곳에서 주로 CA인증서까지 묶음으로 판다.

https://sslhosting.gabia.com/service

신뢰할 수 있는 기업들의 인증서를 가지고있는곳에 클라이언트가 접근을 한다면 중간자 공격등을 염려하지 않아도 된다.

mkcert? Nginx?

다시 본론으로 돌아와서 mkcert 또는 Nginx를 통해 자가서명을 하고 https 접근이 가능하도록 해야했다.

배포이전까지는 mkcert를 사용하자는 의견이 주류가 되어서 mkcert 가 채택되었다. 아래의 과정을 통해 자가서명이 이뤄졌다.

CA 생성

mkcert -install

인증서 생성

mkcert localhost

생성된 인증서 localhost.pem와 개인키 localhost-key.pem 을 프로젝트의 적당한 위치에 넣는다.

main.ts

import * as cookieParser from 'cookie-parser';
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import * as fs from 'fs';

async function bootstrap() {
  const httpsOptions = {
    key: fs.readFileSync('./BE-config/localhost-key.pem'),
    cert: fs.readFileSync('./BE-config/localhost.pem'),
  };

  const app = await NestFactory.create(AppModule, {
    httpsOptions,
  });

  app.enableCors({
    credentials: true,
    origin: '<https://localhost:8001>',
  });
  app.use(cookieParser());

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

요약하자면...

 

귀찮은 작업 없이 빠르게 개발하기위해서는 mkcert를 사용해도 된다.

그러나, mkcert는 개발 환경에서 사용되기 위한 것이므로 실제 서비스에서는 사용하면 안된다!


https://github.com/FiloSottile/mkcert#changing-the-location-of-the-ca-files

https://www.lesstif.com/system-admin/openssl-root-ca-ssl-6979614.html

https://yari-demos.prod.mdn.mozit.cloud/ko/docs/Glossary/HTTPS