[{"data":1,"prerenderedAt":703},["ShallowReactive",2],{"article-locally-signed-certificates-with-mkcert":3,"surround":697},{"id":4,"title":5,"author":6,"body":7,"createdAt":685,"description":686,"extension":687,"meta":688,"navigation":689,"path":690,"published":385,"seo":691,"stem":692,"tags":693,"thumbnail":695,"updatedAt":685,"__hash__":696},"article/article/locally-signed-certificates-with-mkcert.md","Locally Signed Certificates With Mkcert","John Kosmetos",{"type":8,"value":9,"toc":667},"minimark",[10,15,19,22,26,29,41,48,52,65,68,74,79,89,128,132,139,213,225,238,242,249,263,267,273,285,288,296,300,307,341,344,350,354,357,360,402,409,413,416,506,510,513,602,606,609,612,628,655,663],[11,12,14],"h2",{"id":13},"what-is-ssl-and-why-do-i-need-it","What is SSL, and why do I need it?",[16,17,18],"p",{},"If you're building a website, wep app, or anything else that is served over the web, you're going to need a SSL certificate, to verify the identity of your site, and to encrypt the data being transferred between your server and the clients connecting to it.",[16,20,21],{},"It's worth noting that the SSL (Secure Sockets Layer) protocol has been supplanted by TLS (Transport Layer Security), a newer and more secure incarnation, but SSL has been in use for so long, that it's still referred to whenever web security is mentioned, so SSL and TLS are often used interchangeably.",[11,23,25],{"id":24},"the-problem","The problem",[16,27,28],{},"Ok, you've got an idea for a website, and you've just set up your local web server to start bringing it to life, most likely using Nginx or Apache.",[16,30,31,32,36,37,40],{},"You launch your browser, head to ",[33,34,35],"code",{},"https://127.0.0.1/",", expecting to be greeted by ",[33,38,39],{},"Hello World 🌍",", but instead you see the following.",[16,42,43],{},[44,45],"img",{"alt":46,"src":47},"SSL Error","/images/browser-ssl-error.png",[11,49,51],{"id":50},"the-solution","The solution",[16,53,54,55,64],{},"To get rid of this eyesore, you're going to have to generate locally signed certificates, and configure your web server to use them, which under normal circumstances would be a lenghty, and painful process, but thankfully, we have ",[56,57,61],"a",{"href":58,"rel":59},"https://github.com/FiloSottile/mkcert",[60],"nofollow",[33,62,63],{},"mkcert"," to do all the heavy lifting! 🥳",[16,66,67],{},"In short, it creates and installs a local CA (Certificate Authority) that is then used to generate the aforementioned certificates.",[11,69,71,72],{"id":70},"step-1-install-mkcert","Step 1: Install ",[33,73,63],{},[75,76,78],"h3",{"id":77},"mac-os","Mac OS",[16,80,81,82,88],{},"Make sure ",[56,83,87],{"href":84,"rel":85,":target":86},"https://brew.sh/",[60],"_blank","Homebrew"," is installed, then fire up your terminal and run the following.",[90,91,96],"pre",{"className":92,"code":93,"language":94,"meta":95,"style":95},"language-bash shiki shiki-themes plastic","brew install mkcert\nbrew install nss # if you use Firefox\n","bash","",[33,97,98,114],{"__ignoreMap":95},[99,100,103,107,111],"span",{"class":101,"line":102},"line",1,[99,104,106],{"class":105},"sJix2","brew",[99,108,110],{"class":109},"subq3"," install",[99,112,113],{"class":109}," mkcert\n",[99,115,117,119,121,124],{"class":101,"line":116},2,[99,118,106],{"class":105},[99,120,110],{"class":109},[99,122,123],{"class":109}," nss",[99,125,127],{"class":126},"ssUfO"," # if you use Firefox\n",[75,129,131],{"id":130},"linux","Linux",[16,133,134,135,138],{},"First, make sure ",[33,136,137],{},"certutil"," is installed, so depending on your distribution you'll run one of the following commands.",[90,140,142],{"className":92,"code":141,"language":94,"meta":95,"style":95},"sudo apt install libnss3-tools\n    -or-\nsudo yum install nss-tools\n    -or-\nsudo pacman -S nss\n    -or-\nsudo zypper install mozilla-nss-tools\n",[33,143,144,157,162,175,180,195,200],{"__ignoreMap":95},[99,145,146,149,152,154],{"class":101,"line":102},[99,147,148],{"class":105},"sudo",[99,150,151],{"class":109}," apt",[99,153,110],{"class":109},[99,155,156],{"class":109}," libnss3-tools\n",[99,158,159],{"class":101,"line":116},[99,160,161],{"class":105},"    -or-\n",[99,163,165,167,170,172],{"class":101,"line":164},3,[99,166,148],{"class":105},[99,168,169],{"class":109}," yum",[99,171,110],{"class":109},[99,173,174],{"class":109}," nss-tools\n",[99,176,178],{"class":101,"line":177},4,[99,179,161],{"class":105},[99,181,183,185,188,192],{"class":101,"line":182},5,[99,184,148],{"class":105},[99,186,187],{"class":109}," pacman",[99,189,191],{"class":190},"sjrmR"," -S",[99,193,194],{"class":109}," nss\n",[99,196,198],{"class":101,"line":197},6,[99,199,161],{"class":105},[99,201,203,205,208,210],{"class":101,"line":202},7,[99,204,148],{"class":105},[99,206,207],{"class":109}," zypper",[99,209,110],{"class":109},[99,211,212],{"class":109}," mozilla-nss-tools\n",[16,214,215,216,221,222,224],{},"After which you can install ",[56,217,220],{"href":218,"rel":219,":target":86},"https://docs.brew.sh/Homebrew-on-Linux",[60],"Homebrew on Linux",",then finally, ",[33,223,63],{},".",[90,226,228],{"className":92,"code":227,"language":94,"meta":95,"style":95},"brew install mkcert\n",[33,229,230],{"__ignoreMap":95},[99,231,232,234,236],{"class":101,"line":102},[99,233,106],{"class":105},[99,235,110],{"class":109},[99,237,113],{"class":109},[75,239,241],{"id":240},"windows","Windows",[16,243,81,244,88],{},[56,245,248],{"href":246,"rel":247,":target":86},"https://chocolatey.org/",[60],"Chocolatey",[90,250,252],{"className":92,"code":251,"language":94,"meta":95,"style":95},"choco install mkcert\n",[33,253,254],{"__ignoreMap":95},[99,255,256,259,261],{"class":101,"line":102},[99,257,258],{"class":105},"choco",[99,260,110],{"class":109},[99,262,113],{"class":109},[11,264,266],{"id":265},"step-2-install-the-local-ca","Step 2: Install the local CA",[16,268,269,270,272],{},"Once you have ",[33,271,63],{}," up and running on your machine, you need to install the local certificate authority that will be used to generate all of your local certificates, by running the following command.",[90,274,276],{"className":92,"code":275,"language":94,"meta":95,"style":95},"mkcert -install\n",[33,277,278],{"__ignoreMap":95},[99,279,280,282],{"class":101,"line":102},[99,281,63],{"class":105},[99,283,284],{"class":190}," -install\n",[16,286,287],{},"After which you should see the following output.",[90,289,294],{"className":290,"code":292,"language":293},[291],"language-text","Created a new local CA 💥\nThe local CA is now installed in the system trust store! ⚡️\nThe local CA is now installed in the Firefox trust store (requires browser restart)! 🦊\n","text",[33,295,292],{"__ignoreMap":95},[11,297,299],{"id":298},"step-3-generate-your-locally-trusted-certificates","Step 3: Generate your locally trusted certificates",[16,301,302,303,306],{},"Assuming your website's URL is ",[33,304,305],{},"awesomesauce.com",", navigate to your project's root and run the following to generate locally trusted certificates, utilising the CA we installed in the previous step.",[90,308,310],{"className":92,"code":309,"language":94,"meta":95,"style":95},"mkcert awesomesauce.com \"*.awesomesauce.com\" awesomesauce.local localhost 127.0.0.1 ::1\n",[33,311,312],{"__ignoreMap":95},[99,313,314,316,319,323,326,329,332,335,338],{"class":101,"line":102},[99,315,63],{"class":105},[99,317,318],{"class":109}," awesomesauce.com",[99,320,322],{"class":321},"sGSqi"," \"",[99,324,325],{"class":109},"*.awesomesauce.com",[99,327,328],{"class":321},"\"",[99,330,331],{"class":109}," awesomesauce.local",[99,333,334],{"class":109}," localhost",[99,336,337],{"class":190}," 127.0.0.1",[99,339,340],{"class":109}," ::1\n",[16,342,343],{},"Which should result in brand spanking new certificates in your current directory, and the following output! 😎",[90,345,348],{"className":346,"code":347,"language":293},[291],"Created a new certificate valid for the following names 📜\n - \"awesomesauce.com\"\n - \"*.awesomesauce.com\"\n - \"awesomesauce.local\"\n - \"localhost\"\n - \"127.0.0.1\"\n - \"::1\"\n\nThe certificate is at \"./awesomesauce.com+5.pem\" and the key at \"./awesomesauce.com+5-key.pem\" ✅\n",[33,349,347],{"__ignoreMap":95},[11,351,353],{"id":352},"step-4-update-your-server-configuration","Step 4: Update your server configuration",[16,355,356],{},"Once you have your new certificates, you'll need to update your web server to make use of them.",[16,358,359],{},"First things first, copy the certificates over into their respective directories.",[90,361,363],{"className":92,"code":362,"language":94,"meta":95,"style":95},"# Copy over the cert file\ncp ./awesomesauce.com+5.pem /etc/ssl/certs/\n\n# Copy over the key file\ncp ./awesomesauce.com+5-key.pem /etc/ssl/private/\n",[33,364,365,370,381,387,392],{"__ignoreMap":95},[99,366,367],{"class":101,"line":102},[99,368,369],{"class":126},"# Copy over the cert file\n",[99,371,372,375,378],{"class":101,"line":116},[99,373,374],{"class":105},"cp",[99,376,377],{"class":109}," ./awesomesauce.com+5.pem",[99,379,380],{"class":109}," /etc/ssl/certs/\n",[99,382,383],{"class":101,"line":164},[99,384,386],{"emptyLinePlaceholder":385},true,"\n",[99,388,389],{"class":101,"line":177},[99,390,391],{"class":126},"# Copy over the key file\n",[99,393,394,396,399],{"class":101,"line":182},[99,395,374],{"class":105},[99,397,398],{"class":109}," ./awesomesauce.com+5-key.pem",[99,400,401],{"class":109}," /etc/ssl/private/\n",[16,403,404,408],{},[405,406,407],"strong",{},"Note",": If you're using Docker, just mount the above directories into your web server container.",[11,410,412],{"id":411},"apache-v24","Apache (v2.4)",[16,414,415],{},"Make sure that the Apache SSL module is installed and enabled, then update your config file to make use of the newly generated cert files.",[90,417,420],{"className":92,"code":418,"filename":419,"language":94,"meta":95,"style":95},"# /etc/apache2/sites-available/awesomesauce.com.conf\n\n\u003CVirtualHost *:443>\n   ServerName awesomesauce.com\n   DocumentRoot /var/www/awesomesauce.com/public_html\n\n   SSLEngine on\n   SSLCertificateFile /etc/ssl/certs/awesomesauce.com+5.pem\n   SSLCertificateKeyFile /etc/ssl/private/awesomesauce.com+5-key.pem\n\u003C/VirtualHost>\n","/etc/apache2/sites-available/awesomesauce.com.conf",[33,421,422,427,431,449,457,465,469,477,486,495],{"__ignoreMap":95},[99,423,424],{"class":101,"line":102},[99,425,426],{"class":126},"# /etc/apache2/sites-available/awesomesauce.com.conf\n",[99,428,429],{"class":101,"line":116},[99,430,386],{"emptyLinePlaceholder":385},[99,432,433,437,440,443,446],{"class":101,"line":164},[99,434,436],{"class":435},"sVyAn","\u003C",[99,438,439],{"class":321},"VirtualHost ",[99,441,442],{"class":435},"*",[99,444,445],{"class":321},":",[99,447,448],{"class":435},"443>\n",[99,450,451,454],{"class":101,"line":177},[99,452,453],{"class":105},"   ServerName",[99,455,456],{"class":109}," awesomesauce.com\n",[99,458,459,462],{"class":101,"line":182},[99,460,461],{"class":105},"   DocumentRoot",[99,463,464],{"class":109}," /var/www/awesomesauce.com/public_html\n",[99,466,467],{"class":101,"line":197},[99,468,386],{"emptyLinePlaceholder":385},[99,470,471,474],{"class":101,"line":202},[99,472,473],{"class":105},"   SSLEngine",[99,475,476],{"class":109}," on\n",[99,478,480,483],{"class":101,"line":479},8,[99,481,482],{"class":105},"   SSLCertificateFile",[99,484,485],{"class":109}," /etc/ssl/certs/awesomesauce.com+5.pem\n",[99,487,489,492],{"class":101,"line":488},9,[99,490,491],{"class":105},"   SSLCertificateKeyFile",[99,493,494],{"class":109}," /etc/ssl/private/awesomesauce.com+5-key.pem\n",[99,496,498,500,503],{"class":101,"line":497},10,[99,499,436],{"class":435},[99,501,502],{"class":321},"/VirtualHost",[99,504,505],{"class":435},">\n",[75,507,509],{"id":508},"nginx-vtba","Nginx (vTBA)",[16,511,512],{},"Update the server block to make use of the newly generated cert files.",[90,514,516],{"className":92,"code":515,"language":94,"meta":95,"style":95},"# /etc/nginx/conf.d/ssl.conf\n\nserver {\n    listen 443 http2 ssl;\n    listen [::]:443 http2 ssl;\n\n    server_name awesomesauce.com;\n\n    ssl_certificate /etc/ssl/certs/awesomesauce.com+5.pem;\n    ssl_certificate_key /etc/ssl/private/awesomesauce.com+5-key.pem;\n}\n",[33,517,518,523,527,535,552,559,563,572,576,586,596],{"__ignoreMap":95},[99,519,520],{"class":101,"line":102},[99,521,522],{"class":126},"# /etc/nginx/conf.d/ssl.conf\n",[99,524,525],{"class":101,"line":116},[99,526,386],{"emptyLinePlaceholder":385},[99,528,529,532],{"class":101,"line":164},[99,530,531],{"class":105},"server",[99,533,534],{"class":109}," {\n",[99,536,537,540,543,546,549],{"class":101,"line":177},[99,538,539],{"class":105},"    listen",[99,541,542],{"class":190}," 443",[99,544,545],{"class":109}," http2",[99,547,548],{"class":109}," ssl",[99,550,551],{"class":321},";\n",[99,553,554,556],{"class":101,"line":182},[99,555,539],{"class":105},[99,557,558],{"class":321}," [::]:443 http2 ssl;\n",[99,560,561],{"class":101,"line":197},[99,562,386],{"emptyLinePlaceholder":385},[99,564,565,568,570],{"class":101,"line":202},[99,566,567],{"class":105},"    server_name",[99,569,318],{"class":109},[99,571,551],{"class":321},[99,573,574],{"class":101,"line":479},[99,575,386],{"emptyLinePlaceholder":385},[99,577,578,581,584],{"class":101,"line":488},[99,579,580],{"class":105},"    ssl_certificate",[99,582,583],{"class":109}," /etc/ssl/certs/awesomesauce.com+5.pem",[99,585,551],{"class":321},[99,587,588,591,594],{"class":101,"line":497},[99,589,590],{"class":105},"    ssl_certificate_key",[99,592,593],{"class":109}," /etc/ssl/private/awesomesauce.com+5-key.pem",[99,595,551],{"class":321},[99,597,599],{"class":101,"line":598},11,[99,600,601],{"class":321},"}\n",[11,603,605],{"id":604},"time-to-test","Time to test",[16,607,608],{},"If you haven't already, add the following lines to your hosts file to point your domain to your local machine.",[16,610,611],{},"It's typically located in the following locations, depending on your operating system.",[613,614,615,622],"ul",{},[616,617,618,619],"li",{},"Mac OS & Linux - ",[33,620,621],{},"/etc/hosts",[616,623,624,625],{},"Windows 10 - ",[33,626,627],{},"C:\\Windows\\System32\\Drivers\\etc\\hosts",[90,629,631],{"className":92,"code":630,"language":94,"meta":95,"style":95},"127.0.0.1   awesomesauce.local\n127.0.0.1   awesomesauce.com\n127.0.0.1   www.awesomesauce.com\n",[33,632,633,641,648],{"__ignoreMap":95},[99,634,635,638],{"class":101,"line":102},[99,636,637],{"class":105},"127.0.0.1",[99,639,640],{"class":109},"   awesomesauce.local\n",[99,642,643,645],{"class":101,"line":116},[99,644,637],{"class":105},[99,646,647],{"class":109},"   awesomesauce.com\n",[99,649,650,652],{"class":101,"line":164},[99,651,637],{"class":105},[99,653,654],{"class":109},"   www.awesomesauce.com\n",[16,656,657,658,662],{},"All done! 🎉 When you navigate to ",[56,659,660],{"href":660,"rel":661},"https://awesomesauce.com",[60]," in your favourite browser, you should now be greeted with a lock symbol, indicating that the connection between your browser and website is encrypted and secure.",[664,665,666],"style",{},"html pre.shiki code .sJix2, html code.shiki .sJix2{--shiki-default:#B57EDC}html pre.shiki code .subq3, html code.shiki .subq3{--shiki-default:#98C379}html pre.shiki code .ssUfO, html code.shiki .ssUfO{--shiki-default:#5F6672;--shiki-default-font-style:italic}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .sjrmR, html code.shiki .sjrmR{--shiki-default:#56B6C2}html pre.shiki code .sGSqi, html code.shiki .sGSqi{--shiki-default:#A9B2C3}html pre.shiki code .sVyAn, html code.shiki .sVyAn{--shiki-default:#E06C75}",{"title":95,"searchDepth":116,"depth":116,"links":668},[669,670,671,672,678,679,680,681,684],{"id":13,"depth":116,"text":14},{"id":24,"depth":116,"text":25},{"id":50,"depth":116,"text":51},{"id":70,"depth":116,"text":673,"children":674},"Step 1: Install mkcert",[675,676,677],{"id":77,"depth":164,"text":78},{"id":130,"depth":164,"text":131},{"id":240,"depth":164,"text":241},{"id":265,"depth":116,"text":266},{"id":298,"depth":116,"text":299},{"id":352,"depth":116,"text":353},{"id":411,"depth":116,"text":412,"children":682},[683],{"id":508,"depth":164,"text":509},{"id":604,"depth":116,"text":605},"2023-01-01T00:00:00.000Z","Generate locally signed certificates for your development environment in 4 simple steps.","md",{},false,"/article/locally-signed-certificates-with-mkcert",{"title":5,"description":686},"article/locally-signed-certificates-with-mkcert",[694,33],"learning","/images/article/local_ssl.png","yWf6AELlvXd4ybITcxGQ6cJqZUMENrSXDE94wzCNu-Y",[698,699],null,{"title":700,"path":701,"stem":702,"children":-1},"K-NN Image Classification Using Scikit-Learn","/article/ml-knn-image-classification","article/ml-knn-image-classification",1752065530256]