Https를 사용하는 이유
- HTTPS(Hyper-Text Transfer Protocol Secure)는 S라는 약자만 보아도 기존의 HTTP보다 안전하다는 것을 알 수 있다.
- 내가 어떤 웹사이트에 보내는 정보를 다른 누군가 훔쳐보지 못하게 한다.
- 또한 접속한 사이트가 믿을 만한 곳인지를 알려준다.
HTTPS의 원리
- 대칭키와 비대칭키
- 대칭키는 복호화와 암호화 방법이 똑같다.
-> 어떻게 이 대칭키를 양쪽이 가지고 있을까?
-> 문제 발생 - 비대칭키(공개키)는 한 쌍의 두개의 키가 존재한다.
-> A키로 암호화하면 B키에서만 복호화가 가능하고
B키로 암호화하면 A키에서만 복호화가 가능하다.
-> 현업에서는 비공개키는 양쪽 중 한 쪽만 가지고 있고 공개키는 모든 사람들에게 공개해버린다.
-> 이 공개키를 사용하여 HTPPS의 장점을 이뤄낼 수 있다.
HTTPS의 발급 과정(이론)
- Certificate Authority(CA)는 공인된 민간 기업으로 HTTPS 기업에서 뿌린 공개키가 정품인지를 확인해준다.
- 브라우저들은 이 CA들을 내장하고 있다.
- 클라이언트와 서버가 악수
- 클라이언트에서 무작위 데이터를 보내면 서버에서 무작위데이터와 인증서를 보냄
- 클라이언트는 이 인증서를 CA의 개인키를 사용해서 공개키로 복호화한다
- 만약 내장된 CA리스트 중에 이 인증서가 해당하는 것이 없다면 브라우저에서 경고창을 낸다
- 클라이언트와 서버는 공개키로 대칭키를 주고 받는다.
- 클라이언트와 서버는 대칭키로 데이터를 주고 받는다.
개발 시 HTTPS 발급(REACT)
- 먼저 개발 시 우선적으로 https를 사용할 수 있는 환경 세팅
- mkcert: 로컬 환경에서 신뢰할 수 있는 인증서 발급 프로그램
# 리눅스에서 설치
$ sudo apt install libnsdd3-tools
$ wget -O mkcert https://github.com/FiloSottile/mkcert/releases/download/v1.4.3/mkcert-v1.4.3-linux-amd64
$ chmod +x mkcert
$ sudo cp mkcert /usr/local/bin/
$ mkcert -install # local 환경에 CA 생성
$ mkcert -key-file key.pem -cert-file cert.pem localhost 127.0.0.1 ::1 # 인증서 생성# 윈도우에서 설치
$ choco install mkcert
$ mkcert -install # local 환경에 CA 생성
$ mkcert -key-file key.pem -cert-file cert.pem localhost 127.0.0.1 ::1 # 인증서 생성- 초코(choco) 설치 방법은 여기에서 참고
# mac OS에서 설치
$ brew install mkcert
$ mkcert -install # local 환경에 CA 생성
$ mkcert -key-file key.pem -cert-file cert.pem localhost 127.0.0.1 ::1 # 인증서 생성(저는 wsl을 사용했었는데 wsl에서는 윈도우에서 설치 후 chmod로 파일 권한을 바꾼 후 윈도우에서 리눅스로 파일 이동을 써야지만 가능했었습니다.)
- 위와 같은 과정을 진행하면 key.pem 파일과 cert.pem 파일이 생성됨
- 해당 파일을 자신의 프로젝트에 넣고 package.json에서 script의 start 부분을 아래와 같이 바꾸면 된다
"start": "HTTPS=true SSL_CRT_FILE=cert.pem SSL_KEY_FILE=key.pem react-app-rewired start" 개발 시 HTTPS 발급(Node JS의 EXPRESS)
- 위의 1번과 2번 과정은 똑같은 방법으로 진행
- express에서는 아래와 같이 코드를 써서 서버를 연다
import { createServer } from "https";
import * as fs from "fs";
const server = createServer({
key: fs.readFileSync(__dirname + "/../key.pem", "utf-8"),
cert: fs.readFileSync(__dirname + "/../cert.pem", "utf-8"),
}, app);
server.listen(port, () =>{
console.log("https")
});