Tutustu siihen, miten toteuttaa paikallinen HTTPS-kehitystyössäsi työkalujen kuten Mkcert avulla sekä vaiheittaiset oppaat Express.js:lle ja Next.js:lle.
Kun kehität verkkosovelluksia, tietyt tilanteet vaativat HTTPS:ää, jopa paikallisessa ympäristössä. Olitpa sitten integroimassa suojattujen kolmannen osapuolen API:iden kanssa, testaamassa vain HTTPS:lle tarkoitettuja ominaisuuksia kuten service workers ja HTTP/2, tai toistamassa tuotanto-olosuhteita varmistaaksesi saumattoman käyttöönoton, HTTPS on ratkaisevan tärkeää. Lisäksi tietyt selaimen API:t—kuten sijaintitiedot, push-ilmoitukset ja tunnusteiden hallinta—vaativat suojatun kontekstin toimiakseen tehokkaasti.
Esimerkiksi Logto OSS vaatii oletuksena HTTPS:n paitsi localhost, tällaisissa tapauksissa HTTPS:n asettaminen paikallista kehitystä varten voi säästää aikaasi. Tämä artikkeli opastaa sinua HTTPS:n asettamisessa paikalliseen kehitykseen, esitellen työkaluja kuten Mkcert, jotka yksinkertaistavat prosessia.
localhost rooli ja vain HTTPS-ominaisuudetlocalhost on erityinen toimialue, joka voi käsitellä monia vain HTTPS:lle tarkoitettuja toimintoja kuten service workers, secure cookies, HTTP/2 ja muut selaimen API:t voivat toimia hyvin http://localhost:xxxx, joten et välttämättä aina tarvitse paikallista HTTPS:ää, kokeile ensin localhost!
Aiemmin esitelty tässä artikkelissa, Cloudflaren tunnelit voivat helposti tuoda paikallisen palvelusi Internetiin HTTPS valmiina.
Eivätkö nämä 2 vaihtoehtoa ratkaisivat ongelmaasi? Sitten asennetaan paikallinen HTTPS. Seuraavissa vaiheissa oletamme, että paikallinen verkkotunnus on example.com.
Ennen kuin aloitamme, varmista, että kohdedomain ohjautuu paikalliselle koneellesi, tämä voidaan tehdä päivittämällä hosts-tiedostoa. Avaa /etc/hosts Linuxissa/macOS:ssa tai C:\Windows\System32\drivers\etc\hosts Windowsissa, ja lisää seuraavat rivit:
Ensimmäinen asia HTTPS:stä on varmenne. Tuotannossa tämä voidaan tehdä työkaluilla kuten "Let's encrypt" tai ostamalla sertifikaatteja palveluntarjoajilta. Mutta paikallisessa kehityksessä voimme luoda sertifikaatit suoraan.
Mkcert on yksinkertainen konfigurointivapaa työkalu luomaan paikallisesti luotettuja kehityserifikaatteja haluamillasi nimillä.
Aloita seuraamalla virallista opasta asentamaan mkcert, oletamme, että käytät macOS:ia:
Windowsille ja Linuxille, tutustu tähän linkkiin.
Nyt kun mkcert on käytettävissä, suorita tämä komento luodaksesi paikallisen CA:n ja tallentaaksesi juurivarmenteen järjestelmäsi luottamusvarastoon. Oppiaksesi lisää "CA:sta" ja varmennuksista, tutustu Cloudflaren dokumentaatioon.
Luo sitten paikallinen SSL-varmenne
Tämä luo example.com.pem ja example.com-key.pem tiedostot hakemistoosi.
Kun varmenne tiedostot ovat valmiina, voit nyt mahdollistaa HTTPS:n sovelluksessasi. Toisin kuin tuotantoympäristössä, jossa käänteinen välityspalvelin kuten Nginx käsittelee HTTPS:n, paikallisessa kehityksessä voimme asettaa suoraan verkkosovelluksissa. Otetaan esimerkiksi Express.
Luo yksinkertainen Express-palvelin seuraavalla koodilla:
Suorita sovellus ja käy osoitteessa https://example.com nähdäksesi turvallisen Express-sovelluksesi toiminnassa.
Logto OSS vaatii oletuksena HTTPS:n, paitsi localhost, jos haluat suorittaa Logton paikallisesti muulla domainilla, sinun täytyy asettaa paikallinen HTTPS.
mkcert:tä tuottamaan kaksi .pem tiedostoa ja sijoita ne hakemistoon.HTTPS_CERT_PATH että HTTPS_KEY_PATH tehdäksesi HTTPS:n käytön mahdolliseksi Noden kautta, tarkista tämä linkki saadaksesi lisätietoa.HTTPS:n asettaminen paikalliseen kehitykseen ei ole niin monimutkaista kuin miltä se saattaa aluksi tuntua. Työkalujen kuten Mkcert avulla luotettavien paikallisten varmenteiden luominen on nopea ja helppo prosessi. Vaikka localhostLihavoitu usein hoitaa monia vain HTTPS:lle tarkoitettuja ominaisuuksia, on aikoja jolloin tarvitset täyden HTTPS-tuen, ja tämä opas auttaa sinua siinä. Olitpa sitten testaamassa API:ja, työskentelemässä Logto OS:n kanssa tai yksinkertaisesti toistamassa tuotanto-olosuhteita, näiden vaiheiden seuraaminen varmistaa, että olet valmis turvalliseen, saumattomaan kehitykseen.