<div id="readability-page-1" class="page"><cite>유세지</cite>
 2023. 9. 10. 10:30
 <div>
 <figure data-ke-mobilestyle="widthOrigin" data-filename="Thumbnail (3).png" data-origin-width="1920" data-origin-height="1080">
 
 <img src="https://blog.kakaocdn.net/dn/bxXU96/btstxpDT3PQ/ikFVQpIdFkK1gZsItqfrk1/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="720" height="405" data-filename="Thumbnail (3).png" data-origin-width="1920" data-origin-height="1080">
 
 
</figure>


지난 <a href="https://usage.tistory.com/198" target="_blank" rel="noopener">인터넷 프로토콜 HTTP와 HTTPS</a> 포스트에서는 https가 무엇이며, 어떤 역할을 하는지에 대해 알아보았습니다. 오늘은 운영중인 사이트에 실제로 https 연결을&nbsp;적용해보는 방법에 대해 알아봅니다.


<h3 data-ke-size="size23">적용 방법</h3>
https는 인증과 암호화를 통해 연결의 보안성과 무결성을 확보합니다. 이때 필요한 것이 바로 인증서인데, 가장 안전한 방법으로는 신뢰할 수 있는 기관이 발급해주는 인증서를 사용하는 방법이 있습니다. 여기서 말하는 신뢰할 수 있는 기관이란 국제적으로 인정받은 전문 인증서 발급기관으로, 대표적으로는 GeoTrust나 GlobalSign 등이 있습니다.

이러한 기관에서 발급 받은 인증서는 기관 차원에서 인증서를 보증한다는 장점과, 관리를 위한 전문가가 존재한다는 장점이 있지만 개인이 사용하기에는 대체로 부담스러운 가격을 갖고 있습니다. 따라서 소규모 기업이나 개인이 위와 같은 CA의 인증서를 사용하기는 현실적으로 어렵습니다.

그렇다고 https를 포기하고, 브라우저에 안전하지 않은 연결이라고 표시되는 http로 돌아갈 수는 없겠지요. 우리에겐 비싼 CA의 인증서 대신, 개인이 무료로 사용할 수 있는 Let's Encrypt 인증서를 사용하는 방법이 있습니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_blob" data-origin-width="938" data-origin-height="576">
 
 <img src="https://blog.kakaocdn.net/dn/ThLwI/btstr0L2k0A/MfHEaZNECdJCDbM2i5E6d0/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="702" height="431" data-filename="edited_blob" data-origin-width="938" data-origin-height="576">
 
 <figcaption>Let's Encrypt Home page</figcaption>
</figure>


Let's Encrypt는 전 세계 사람들이 SSL/TLS 인증서를 획득하고, 관리할 수 있도록 지원하는 글로벌 인증 기관이자 비영리 단체입니다. 누구나 무료로 인증서를 발급받아 사용할 수 있으며 관련한 자료도 많아 전 세계적으로 많이 사용되고 있습니다. Let's Encrypt로 발급한 인증서의 유효기간은 약 3개월로, 비교적 짧습니다. 때문에 3개월마다 자동으로 인증서를 새로 갱신해주는 Certbot이라는 프로그램과 함께 사용하는 경우가 많습니다.

이것도 충분히 쉽고 좋은 방법이지만, 오늘은 Cloudflare를 이용하여 더 간단하게 https를 적용해보겠습니다.


<h3 data-ke-size="size23">Cloudflare 사용하기</h3>
Cloudflare는 CDN 서비스를 통해 사이트 접속 속도 및 보안 향상 등을 제공하는 서비스입니다. 우리는 Cloudflare를 통해 자체적으로 발급해주는 인증서로 https 연결을 사용할 수 있습니다. 서버에 직접 접근하던 기존의 http 요청 대신, Cloudflare가 중간에서 https를 통해&nbsp;사용자의 요청을 받고, 다시 기존 서버와 통신을 하는 방식으로 적용됩니다.


<figure data-ke-mobilestyle="widthOrigin" data-origin-width="2540" data-origin-height="542">
 
 <img src="https://blog.kakaocdn.net/dn/bMy90I/btstyxBAgOO/wFCW1IIqUQN0R4DK7iEMp1/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="748" height="160" data-origin-width="2540" data-origin-height="542">
 
 <figcaption>Cloudflare를 사용하면 변경되는 흐름</figcaption>
</figure>

여기서 추가적으로 서버가 자체적으로 가지고 있는 인증서를 통해 Cloudflare와 서버 간 http 연결 부분도 https로 변경할 수 있습니다. 이 경우에는 위에서 소개한 certbot을 이용하면 되겠네요.

원리 자체는 어렵지 않으니, 우리 서비스에 바로 적용해보도록 하겠습니다.
우선 도메인과 해당 도메인에 http로 배포된 자신의 서비스가 있다고 가정한 뒤 진행하겠습니다.

먼저 Cloudflare에 로그인하여 대시보드에 들어갑니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_blob" data-origin-width="1144" data-origin-height="501">
 
 <img src="https://blog.kakaocdn.net/dn/bv0tSt/btstwGfdLK1/h99Mg7T9CRbtLUzdvU2JO0/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="700" height="307" data-filename="edited_blob" data-origin-width="1144" data-origin-height="501">
 
 <figcaption>Cloudflare의 대시보드</figcaption>
</figure>


오른쪽의 사이트 추가 버튼을 눌러 현재 서비스의 도메인을 입력해줍니다.



<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_blob" data-origin-width="1168" data-origin-height="475">
 
 <img src="https://blog.kakaocdn.net/dn/F79Ac/btsts66joJa/x6xSdQDiNJT5CZiM5MKla1/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="715" height="291" data-filename="edited_blob" data-origin-width="1168" data-origin-height="475">
 
 <figcaption>서비스 도메인 입력 단계</figcaption>
</figure>


도메인을 입력하면 요금제 선택 화면이 나오는데,
규모있는 서비스나 기업의 경우 설명을 살펴보고 필요에 맞게 적절히 선택하면 되겠습니다.

저는 개인 프로젝트 용도이므로 가장 아래의 free 요금제를 선택하겠습니다.



<figure>
 <span data-url="https://blog.kakaocdn.net/dn/bkPDGh/btstrQ31yFM/73xgVxFDqNzk7LkYhoe7h0/img.png" data-lightbox="lightbox" data-origin-width="1215" data-origin-height="768" data-is-animation="false" data-filename="edited_blob" width="715" height="452" data-widthpercent="43.04"><img src="https://blog.kakaocdn.net/dn/bkPDGh/btstrQ31yFM/73xgVxFDqNzk7LkYhoe7h0/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';"><span data-url="https://blog.kakaocdn.net/dn/dLfrUu/btstztTehbw/flrIpXnj7ZW1gs8f7q5u70/img.png" data-lightbox="lightbox" data-origin-width="917" data-origin-height="438" data-is-animation="false" data-filename="blob" width="682" height="326" data-widthpercent="56.96"><img src="https://blog.kakaocdn.net/dn/dLfrUu/btstztTehbw/flrIpXnj7ZW1gs8f7q5u70/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';">
 
 <figcaption>요금제 선택 화면</figcaption>
</figure>


요금제를 선택하면 개요 화면으로 넘어옵니다.
빠른 시작 가이드의 설정 검토 버튼을 눌러 필요한 정책들을 빠르게 세팅할 수 있습니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_edited_blob" data-origin-width="1212" data-origin-height="478">
 
 <img src="https://blog.kakaocdn.net/dn/oVTwg/btstzuxQyeu/NXJbzdHDtXN2sNvBJiuQ60/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="756" height="298" data-filename="edited_edited_blob" data-origin-width="1212" data-origin-height="478">
 
 <figcaption>개요 화면</figcaption>
</figure>


아래 캡쳐에서 brotli의 경우 압축 알고리즘의 일종입니다.
gzip과 같은 역할을 하지만 더 높은 수준의 압축률을 갖고 있어 웹 페이지를 더 빠르게 로딩할 수 있습니다.


<figure>
 <span data-url="https://blog.kakaocdn.net/dn/VmTD6/btstrO6cfJt/kzAI7Y0QNd81JBgVG3whu0/img.png" data-lightbox="lightbox" data-origin-width="923" data-origin-height="725" data-is-animation="false" data-filename="blob" data-widthpercent="30.11"><img src="https://blog.kakaocdn.net/dn/VmTD6/btstrO6cfJt/kzAI7Y0QNd81JBgVG3whu0/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';"><span data-url="https://blog.kakaocdn.net/dn/biKj9Z/btstr2pxn3p/M3dkUbnDF6TIaqAbwxPFIK/img.png" data-lightbox="lightbox" data-origin-width="916" data-origin-height="614" data-is-animation="false" data-filename="blob" data-widthpercent="35.28"><img src="https://blog.kakaocdn.net/dn/biKj9Z/btstr2pxn3p/M3dkUbnDF6TIaqAbwxPFIK/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';"><span data-url="https://blog.kakaocdn.net/dn/bCec31/btsts2iwSsp/eRUKFkIGNA530HnLOp8w4k/img.png" data-lightbox="lightbox" data-origin-width="834" data-origin-height="570" data-is-animation="false" data-filename="blob" data-widthpercent="34.61"><img src="https://blog.kakaocdn.net/dn/bCec31/btsts2iwSsp/eRUKFkIGNA530HnLOp8w4k/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';">
 
 <figcaption>중요한 정책들을 위주로 빠르게 설정할 수 있습니다</figcaption>
</figure>


마침 버튼을 눌러 빠른 시작 가이드를 종료하면, 이제 네임 서버를 설정해 줄 차례입니다.
이번 작업을 통해 사용자가 Cloudflare에 먼저 접근할 수 있게 됩니다.

네임 서버의 경우 처음 도메인을 등록했던 사이트에서 변경할 수 있습니다.
제 경우엔 후이즈에서 도메인을 구매하여 후이즈 사이트에서 변경하였습니다.


<figure>
 <span data-url="https://blog.kakaocdn.net/dn/cfuQLZ/btstx7XroEx/k5bDKt4kbEZlcDKhLD2Ybk/img.png" data-lightbox="lightbox" width="503" height="650" data-origin-width="591" data-origin-height="764" data-filename="blob" data-is-animation="false" data-widthpercent="44.95"><img src="https://blog.kakaocdn.net/dn/cfuQLZ/btstx7XroEx/k5bDKt4kbEZlcDKhLD2Ybk/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';"><span data-url="https://blog.kakaocdn.net/dn/DBNyR/btstw3BfDw3/1HjPQqBQ6YLrxA0735530K/img.png" data-lightbox="lightbox" data-origin-width="774" data-origin-height="817" data-is-animation="false" data-filename="blob" data-widthpercent="55.05"><img src="https://blog.kakaocdn.net/dn/DBNyR/btstw3BfDw3/1HjPQqBQ6YLrxA0735530K/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';">
 
 <figcaption>네임 서버 설정 화면</figcaption>
</figure>


네임 서버를 변경하고 이름 서버 확인 버튼을 누르거나 잠시 기다리면, 정상적으로 https 연결이 적용됩니다.
하지면 여전히 http를 통한 접근이 가능합니다.

규칙의 Page Rules를 설정하여 http로 접근한 경우, 자동으로 https로 리다이렉트 되도록 변경하겠습니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_blob" data-origin-width="1220" data-origin-height="760">
 
 <img src="https://blog.kakaocdn.net/dn/2fVX7/btstsOriiZd/RSlK75t5tHoCDE2mxwkaMK/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="722" height="450" data-filename="edited_blob" data-origin-width="1220" data-origin-height="760">
 
 <figcaption>규칙 - Page Rules 설정 화면</figcaption>
</figure>


도메인 주소 뒤에는 * (와일드카드) 를 붙여 모든 요청에 매치되도록 하고,
설정 선택에서는 "항상 HTTPS 사용" 을 선택해줍니다.

이렇게 HTTPS를 사용하기 위한 모든 설정이 완료되었습니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="blob" data-origin-width="514" data-origin-height="315">
 
 <img src="https://blog.kakaocdn.net/dn/bBnuwt/btstCVWkonc/ql1DskByzSmvQkqIsdP8G1/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" data-filename="blob" data-origin-width="514" data-origin-height="315">
 
 <figcaption>잘 적용된 모습이네요</figcaption>
</figure>



<h3 data-ke-size="size23">마치며</h3>
오늘은 https를 적용하는 과정, 그중에서도 Cloudflare를 이용하는 방법에 대해 알아보았습니다. 이전에는 Cloudflare에서 자체 서명한 인증서를 사용했던것 같은데, 지금은 Let's Encrypt 인증서를 사용하는 것으로 보이네요. 적용한 요금제가 free 플랜이 아니면 달라지는지에 대해선 확인이 필요할 것 같습니다.


<figure data-ke-mobilestyle="widthOrigin" data-filename="edited_blob" data-origin-width="539" data-origin-height="659">
 
 <img src="https://blog.kakaocdn.net/dn/libOw/btsts2pqbWO/cBOK6dGlFPNSswUFqNk2gK/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" width="503" height="618" data-filename="edited_blob" data-origin-width="539" data-origin-height="659">
 
 <figcaption>'조직'에 Let's Encrypt 가 보입니다</figcaption>
</figure>


읽어주셔서 감사합니다.
틀린 내용에 대한 지적은 댓글로 부탁드립니다.
 
 
 </div></div>

개발의 올바르지 않은 용례

지난 인터넷 프로토콜 HTTP와 HTTPS 포스트에서는 https가 무엇이며, 어떤 역할을 하는지에 대해 알아보았습니다. 오늘은 운영중인 사이트에 실제로 https 연결을 적용해보는 방법에 대해 알아봅니다.
 
 
적용 방법
https는 인증과 암호화를 통해 연결의 보안성과 무결성을 확보합니다. 이때 필요한 것이 바로 인증서인데, 가장 안전한 방법으로는 신뢰할 수 있는 기관이 발급해주는 인증서를 사용하는 방법이 있습니다. 여기서 말하는 신뢰할 수 있는 기관이란 국제적으로 인정받은 전문 인증서 발급기관으로, 대표적으로는 GeoTrust나 GlobalSign 등이 있습니다.
 
이러한 기관에서 발급 받은 인증서는 기관 차원에서 인증서를 보증한다는 장점과, 관리를 위한 전문가가 존재한다는 장점이 있지만 개인이 사용하기에는 대체로 부담스러운 가격을 갖고 있습니다. 따라서 소규모 기업이나 개인이 위와 같은 CA의 인증서를 사용하기는 현실적으로 어렵습니다.
 
그렇다고 https를 포기하고, 브라우저에 안전하지 않은 연결이라고 표시되는 http로 돌아갈 수는 없겠지요. 우리에겐 비싼 CA의 인증서 대신, 개인이 무료로 사용할 수 있는 Let's Encrypt 인증서를 사용하는 방법이 있습니다.
 
 
 
 
Let's Encrypt는 전 세계 사람들이 SSL/TLS 인증서를 획득하고, 관리할 수 있도록 지원하는 글로벌 인증 기관이자 비영리 단체입니다. 누구나 무료로 인증서를 발급받아 사용할 수 있으며 관련한 자료도 많아 전 세계적으로 많이 사용되고 있습니다. Let's Encrypt로 발급한 인증서의 유효기간은 약 3개월로, 비교적 짧습니다. 때문에 3개월마다 자동으로 인증서를 새로 갱신해주는 Certbot이라는 프로그램과 함께 사용하는 경우가 많습니다.
 
이것도 충분히 쉽고 좋은 방법이지만, 오늘은 Cloudflare를 이용하여 더 간단하게 https를 적용해보겠습니다.
 
 
Cloudflare 사용하기
Cloudflare는 CDN 서비스를 통해 사이트 접속 속도 및 보안 향상 등을 제공하는 서비스입니다. 우리는 Cloudflare를 통해 자체적으로 발급해주는 인증서로 https 연결을 사용할 수 있습니다. 서버에 직접 접근하던 기존의 http 요청 대신, Cloudflare가 중간에서 https를 통해 사용자의 요청을 받고, 다시 기존 서버와 통신을 하는 방식으로 적용됩니다.
 
 
 
여기서 추가적으로 서버가 자체적으로 가지고 있는 인증서를 통해 Cloudflare와 서버 간 http 연결 부분도 https로 변경할 수 있습니다. 이 경우에는 위에서 소개한 certbot을 이용하면 되겠네요.
 
원리 자체는 어렵지 않으니, 우리 서비스에 바로 적용해보도록 하겠습니다.
우선 도메인과 해당 도메인에 http로 배포된 자신의 서비스가 있다고 가정한 뒤 진행하겠습니다.
 
먼저 Cloudflare에 로그인하여 대시보드에 들어갑니다.
 
 
 
 
오른쪽의 사이트 추가 버튼을 눌러 현재 서비스의 도메인을 입력해줍니다.
 
 
 
 
 
도메인을 입력하면 요금제 선택 화면이 나오는데,
규모있는 서비스나 기업의 경우 설명을 살펴보고 필요에 맞게 적절히 선택하면 되겠습니다.
 
저는 개인 프로젝트 용도이므로 가장 아래의 free 요금제를 선택하겠습니다.
 
 
 
 
 
요금제를 선택하면 개요 화면으로 넘어옵니다.
빠른 시작 가이드의 설정 검토 버튼을 눌러 필요한 정책들을 빠르게 세팅할 수 있습니다.
 
 
 
 
아래 캡쳐에서 brotli의 경우 압축 알고리즘의 일종입니다.
gzip과 같은 역할을 하지만 더 높은 수준의 압축률을 갖고 있어 웹 페이지를 더 빠르게 로딩할 수 있습니다.
 
 
 
 
마침 버튼을 눌러 빠른 시작 가이드를 종료하면, 이제 네임 서버를 설정해 줄 차례입니다.
이번 작업을 통해 사용자가 Cloudflare에 먼저 접근할 수 있게 됩니다.
 
네임 서버의 경우 처음 도메인을 등록했던 사이트에서 변경할 수 있습니다.
제 경우엔 후이즈에서 도메인을 구매하여 후이즈 사이트에서 변경하였습니다.
 
 
 
 
네임 서버를 변경하고 이름 서버 확인 버튼을 누르거나 잠시 기다리면, 정상적으로 https 연결이 적용됩니다.
하지면 여전히 http를 통한 접근이 가능합니다.
 
규칙의 Page Rules를 설정하여 http로 접근한 경우, 자동으로 https로 리다이렉트 되도록 변경하겠습니다.
 
 
 
 
도메인 주소 뒤에는 * (와일드카드) 를 붙여 모든 요청에 매치되도록 하고,
설정 선택에서는 "항상 HTTPS 사용" 을 선택해줍니다.
 
이렇게 HTTPS를 사용하기 위한 모든 설정이 완료되었습니다.
 
 
 
 
 
마치며
오늘은 https를 적용하는 과정, 그중에서도 Cloudflare를 이용하는 방법에 대해 알아보았습니다. 이전에는 Cloudflare에서 자체 서명한 인증서를 사용했던것 같은데, 지금은 Let's Encrypt 인증서를 사용하는 것으로 보이네요. 적용한 요금제가 free 플랜이 아니면 달라지는지에 대해선 확인이 필요할 것 같습니다.
 
 
 
 
읽어주셔서 감사합니다.
틀린 내용에 대한 지적은 댓글로 부탁드립니다.

Cloudflare로 https 적용하기

댓글