크롬(Chrome) 브라우저,  localhost, nginx에서 SSL(https) 설정하기
- 작업 도메인 local.test 


* openssl 다운로드 설치
https://slproweb.com/products/Win32OpenSSL.html



//==================
* 인증서 발행용 설정파일(local.test.conf) 작성

[ req ]
default_bits        = 2048
default_keyfile     = server-key.pem # 이 파일은 없어도 됨
distinguished_name  = subject
req_extensions      = req_ext
x509_extensions     = x509_ext
string_mask         = utf8only

[ subject ]
countryName                 = Country Name (2 letter code)
countryName_default         = US
stateOrProvinceName         = State or Province Name (full name)
stateOrProvinceName_default = NY
localityName                = Locality Name (eg, city)
localityName_default        = New York
organizationName            = Organization Name (eg, company)
organizationName_default    = a local0    
commonName                  = Common Name (e.g. server FQDN or YOUR name)
commonName_default          = a local  #  <=== 요기가 표시 이름
emailAddress                = Email Address
emailAddress_default        = test@example.com

[ x509_ext ]
subjectKeyIdentifier   = hash
authorityKeyIdentifier = keyid,issuer
basicConstraints       = CA:FALSE
keyUsage               = digitalSignature, keyEncipherment
subjectAltName         = @alternate_names
nsComment              = "OpenSSL Generated Certificate"

[ req_ext ]
subjectKeyIdentifier = hash

basicConstraints     = CA:FALSE
keyUsage             = digitalSignature, keyEncipherment
subjectAltName       = @alternate_names
nsComment            = "OpenSSL Generated Certificate"

[ alternate_names ]
DNS.1       = local.test    #  <=== 요기를 변경



//==================
* 인증서 파일(local.test.key , local.test.crt ) 생성
openssl req -config local.test.conf -new -sha256 -newkey rsa:2048 -nodes -keyout local.test.key -x509 -days 365 -out local.test.crt


//===================
* nginx 웹서버 설정파일(nginx.conf) 수정후 웹서버 재시작

    server {
server_name   local.test;

        listen       80;
        listen 443 ssl;

    ssl_certificate c:/nginx/ssl/local.test.crt;
    ssl_certificate_key c:/nginx/ssl/local.test.key;



//=============
* 크롬으로 사이트 접속하면 에러 발생

     - 해결방법 : 내 컴퓨터에 인증서를 등록
      - 아래는 에러메시지들
//
Certificate - missing This site is missing a valid, trusted certificate (net::ERR_CERT_AUTHORITY_INVALID)

공격자가 local.test에서 정보(예: 비밀번호, 메시지, 신용카드 등)를 도용하려고 시도 중일 수 있습니다. 자세히 알아보기
NET::ERR_CERT_AUTHORITY_INVALID

이 서버가 local.test임을 입증할 수 없으며 컴퓨터의 운영체제에서 신뢰하는 보안 인증서가 아닙니다. 서버를 잘못 설정했거나 불법 사용자가 연결을 가로채고 있기 때문일 수 있습니다.


//
Subject Alternative Name Missing The certificate for this site does not contain a Subject Alternative Name extension containing a domain name or IP address.

연결이 비공개로 설정되어 있지 않습니다.
공격자가 local.test에서 정보(예: 비밀번호, 메시지, 신용카드 등)를 도용하려고 시도 중일 수 있습니다. 자세히 알아보기
NET::ERR_CERT_COMMON_NAME_INVALID

방문한 일부 페이지의 URL, 제한된 시스템 정보, 일부 페이지 콘텐츠를 Google에 전송하여 Chrome 보안을 강화하는 데 참여해 주세요. 
개인정보처리방침
보안 인증서에 주체 대체 이름(SAN)이 지정되어 있지 않아 이 서버가 local.test임을 입증할 수 없습니다. 서버를 잘못 설정했거나 공격자가 연결을 가로채고 있기 때문일 수도 있습니다.

주체 대체 이름(SAN) Subject Alternative Names




//===================
* 인증서 내보내기
    - 아래 과정은 생성된 local.test.crt을 다시 만드는 과정
    - 맨 처음 과정에서 생성된 local.test.crt을 등록해서 안될때 실행


Chrome -> Dev Tool (F12) 
-> Security 탭 -> View ceritificate
-> 인증서 -> 자세히 탭 -> 파일에 복사 
-> 다음 -> DER로 인코딩된 바이너리 X.509(.CER) 선택 -> 다음


//=================================
* 내 컴퓨터에 인증서 등록
    - 맨 처음 과정에서 생성된 local.test.crt을 등록해도 됨

//===========
- 인증서 등록 방법 1
인증서 파일( local.test.crt) 더블 클릭 or 파일 우클릭 -> 인증서 설치
-> 로컬 컴퓨터 -> 다음 -> 모든 인증서를 다음 저장소에 저장 선택 -> 찾아보기 
-> 타사 루트 인증 기관 -> 다음 -> 마침


//===========
- 인증서 등록 방법 2
- 방법1로 안되든지 등록이 잘 됬는지 확인할때 사용
Win Key+R -> mmc 실행 
-> 파일 -> 스냅인 추가/제거 
-> 사용가능한 스냅인 : 인증서 선택 -> 추가 
-> '컴퓨터 계정' 선택 -> 다음 -> '로컬 컴퓨터' 선택 -> 마침


콘솔(mmc) 에서 추가된 인증서 더블 클릭
-> 타사 루트 인증 기관(Third-Party Root Certification Authorities) -> 
-> 인증서 에서 우클릭 -> 모든 작업 -> 가져오기
-> 위에서 생성한 인증서 파일 선택 
-> '모든 인증서를 다음 저장소에 저장' 선택 -> 다음 -> 마침


//=====================================
* 재시작
웹서버 재시작 (옵션)
크롬 캐시 지우기 -> 크롬 재시작


//================ 

* 컴퓨터를 재부팅하면 위에 등록된 인증서가 등록이 해제되는 경우가 있음

그때는 위의 방법으로 재등록

등록 해제 안되도록 하는 방법은 연구중 ;;

 

 


//=========
// 참고
How to Set Up HTTPS Locally Without Getting Annoying Browser Privacy Errors 
https://deliciousbrains.com/https-locally-without-browser-privacy-errors/


How to Get HTTPS Working in Windows 10 Localhost Dev Environment
https://zeropointdevelopment.com/how-to-get-https-working-in-windows-10-localhost-dev-environment/



//===============================
< 소용없는 방법들 >


* 크롬 설정 변경
chrome://flags/#allow-insecure-localhost


* 도메인 이름 변경
*.test , *.local , *.localhost

Posted by 코덴스

댓글을 달아 주세요