ERR_CERT_COMMON_NAME_INVALID 오류

모바일 개발자이지만 현 회사에서는 MacOS 프로그램 개발을 병행하고 있다.

PC쪽 개발은 처음이라 로직상의 문제보다는 설치파일 생성 및 환경 세팅에서 무한 삽질과 넘어짐의 반복이다.

 

관련 경험들은 이후에 소소하게 포스팅 할 생각이다.

 

오늘 내용은 그중 하나인 인증서 관련이다.

 

히스토리를 짦게 말하면

웹페이지에서 자바스크립트를 통해 만들어놓은 로컬 웹서버(localhost)를 호출해야 했다.

 

HTTPS가 가능해야 했기에 OpenSSL을 통해 사설 인증서를 만들었다.

윈도우의 경우는 아래 링크에서 OpenSSL 다운로드하면 된다.

http://slproweb.com/products/Win32OpenSSL.html

Win32/Win64 OpenSSL Installer for Windows - Shining Light Productions

만든 인증서를 로컬 웹서버에 넣고 정상적으로 실행을 하였다.

 

사파리에서 HTTPS를 통해 localhost 호출에 성공했다.

(물론 그전에 CORS 설정을 해줘야 한다.)

 

하지만... 크롬에서는 제목과 같이 ERR_CERT_COMMON_NAME_INVALID 오류가 나왔다.

이리저리 검색해보니 아래와 같은 내용을 찾을 수 있었다.

https://support.google.com/chrome/a/answer/7391219?hl=ko​

 

크롬 58부터는 인증서의  subjectAltName 항목이 설정되어야 한다는 내용이다.

openssl 폴더에 보면 openssl 이름으로 .cnf 또는 .cfg 파일이 있는데 이게 설정파일이다.

거기에 보면 많은 주석과 설정이 있는데 새로 간략하게 만들어서 했다.

[req]
distinguished_name  = req_distinguished_name
x509_extensions     = v3_req
prompt              = no
[req_distinguished_name]
C           = KR
ST          = TEST
L           = TEST
O           = TEST
OU          = TEST
CN          = TEST
[v3_req] 
keyUsage           = keyEncipherment, dataEncipherment
extendedKeyUsage   = serverAuth
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost
IP.1 = 127.0.0.1

DNS.1 을 호출하려는 도메인명으로 설정하면된다.

 

새로 만든 인증서를 로컬 웹서버에 적용 후 크롬에서 접속 성공하였다.

 

보다 자세한 내용은 아래 링크에서 확인!

https://onlinehelp.tableau.com/current/server/ko-kr/ssl_cert_create.htm#san-certs

예: SSL 인증서 - 키 및 CSR 생성 - Tableau