HTTPS
HTTP는 웹 상에서 정보를 주고 받기 위해 정해진 일련의 통신규약이다. HTTPS는 HTTP에 SSL(Secure Socket Layer)이 추가되어 모든 요청과 응답은 네트워크로 전송되기 전 암호화 된다.
SSL(Secure Socket Layer)
SSL은 클라이언트와 서버간 통신에서 공인된 제3자의 업체(CA)가 보증해주는 일련의 인증서를 의미한다.
SSL을 통해 HTTP 요청과 응답은 그 전송되는 내용이 노출되거나 변경되는 것을 방지할 수 있고, 클라이언트가 접속하려고 하는 서버가 신뢰(안전)할 수 있는지등을 확인할 수 있다.
SSL에서 사용하는 암호화는 공개키 방식과 대칭키 방식으로 나뉜다.
공개키 vs 대칭키
공개키 암호화 방식
HTTP 요청과 응답으로 전송되는 데이터를 암호화 및 복호화(암호를 푸는 것)할 때, 사용되는 키가 다르다.
- 암호화 속도가 느림
- 키를 교환할 필요가 없어 탈취될 가능성이 없음
- 기밀성/인증/부인방지 보장
- 대표 알고리즘 : Diffie Hellman, RSA, DSA, ECC 등
- 방식 (A -> B)
- A (hello world!) -> 암호화 (A의 공개키 사용) -> 암호화된 데이터 전송 -> 복호화 (B의 개인키 사용) -> B (hello world!)
대칭키 암호화 방식
HTTP 요청과 응답으로 전송되는 데이터를 암호화 및 복호화할 때, 사용되는 키가 동일하다.
- 암호화 속도가 빠르고, 대용량 데이터에 적합
- 키를 교환해야 하기 때문에, 통신과정에서 탈취될 가능성이 존재
- 기밀성 보장
- 무결성/인증/부인방지 보장하지 않음
- 사용자가 늘어날 수록 관리하기 어려우며, 확장성이 좋지 않음
- 대표 알고리즘 : SEED, DES, ARIA, AES 등
HTTPS 암호화 방식
앞서 살펴본 바로는 공개키의 경우 암호화속도가 느리지만, 보안에 유리하며, 대칭키의 경우 속도가 빠르지만, 보안에 취약하다. 때문에, HTTPS 에서는 대칭키를 전송할 때, 공개키 방식으로 전송하여 수신자에게 전송하고, 수신자는 이렇게 전송된 대칭키를 사용하여 송신자와의 통신을 하게 되고, 이를 통해 공개키와 대칭키 방식이 가지는 장단점을 상호보완하여 통신이 이루어진다.
일반적으로 이루어지는 디지털 인증서의 작동원리는 다음과 같다.
- A와 B가 통신을 하는 상황을 가정해보면,
- A는 제3자인 CA(Certification Authority, 인증기관)에게 자신이 A가 맞다는 증명과 자신의 공개 키가 자신의 키가 맞음을 보증하는 인증서를 요청한다.
- CA는 A에게 암호화된 인증서(A의 공개키를 포함)를 전송한다.
- A는 암호화된 인증서를 B에게 전송한다.
- B는 해당 인증서를 복호화하기 위한 키를 CA에게 요청한다.
- CA는 해당 인증서가 유효하다면 B에게 키를 전송한다.
- B는 CA로부터 발급받은 키를 통해 A와 통신한다.
HTTPS 설정 방법 (localhost에 HTTPS 적용 for React)
mkcert
개발과정에서 localhost를 https로 동작하게 해주는 매우 유용한 툴이다.
나는 OSX환경이므로, 이에 맞는 방법을 소개하려고 한다.
-
설치하기
brew install mkcert해당 명령어를 터미널에 입력하여 mkcert를 설치해준다.
-
프로젝트 디렉토리에 설치하기
mkcert -install터미널을 열고, 적용하려는 프로젝트의 최상위 디렉토리로 접근하여 위의 명령어를 입력한다.
터미널에서
The local CA is already installed in the system trust store! 👍가 출력되었다면, 정상적으로 실행된 것이다. -
key.pem & cert.pem 발급하기
mkcert -key-file key.pem -cert-file cert.pem localhost 127.0.0.1 ::1해당 명령어를 터미널에서 프로젝트 폴더의 최상위 디렉토리로 접근하여 실행해준다. 그렇다면, 해당 디렉토리에
key.pem과cert.pem이 생성된 것을 확인할 수 있다. -
package.json 수정하기
"HTTPS=true SSL_CRT_FILE=`cert.pem이 위치한 경로` SSL_KEY_FILE=`key.pem이 위치한 경로` react-scripts start"package.json을 열고, script 부분의 start 부분을 위의 양식에 맞게 수정해준뒤, 웹 페이지를 실행하면 https가 적용되었음을 알 수 있다.
❓key.pem & cert.pem
.pem: 일반적으로, 공개키를 의미하며, 서버로부터 전송받은 데이터를 인증하거나 복호화할 때, 사용되는 파일의 확장자를 의미key.pem: 키에 해당cert.pem: 인증서에 해당
글을 마치며
저번 포스팅과 이번 포스팅으로 HTTP와 HTTPS 그리고 간단한 적용방법에 대하여 알아보았다. 이전에도 한번 공부한적이 있었지만, 다시 공부하면서 여전히 헷갈리거나 어려운 부분이 많았고, 이후에는 기회가 된다면, localhost에 적용하는 방법이 아닌, 실제 도메인을 구입하여 해당 도메인에 HTTPS를 설정하는 방법을 작성해보려고 한다.
