Att ställa in HTTPS lokalt kan vara svårt. Även om du lyckas brottas med självsignerade certifikat till inlämning, får du fortfarande fel i webbläsarens integritet. I den här artikeln går vi igenom att skapa din egen certifikatutfärdare för dina lokala servrar så att du kan köra HTTPS-webbplatser lokalt utan problem.

Varför HTTPS lokalt?

Varför inte bara använda vanlig HTTP lokalt? För om din produktionswebbplats endast är HTTPS och du utvecklar lokalt på vanlig HTTP, är dina utvecklings- och produktionsmiljöer inte lika lika som de kunde vara. Till exempel körs min utvecklingsmiljö för den här webbplatsen (deliciousbrains.com) som en Ubuntu-server i en virtuell VMware-maskin (VM) på sin Mac. Produktionsplatsen är en Ubuntu-server som körs på Linode med en nästan identisk konfiguration.

Du vill definitivt att din utvecklingsmiljö ska spegla produktionen så nära som möjligt.
När den inte gör det bjuder du in fler problem dyker upp i produktion som inte dyker upp i dev. Att köra HTTP när din produktionswebbplats endast är HTTPS är definitivt en onödig risk.

Att försöka få ett SSL-certifikat som fungerar med din lokala server är dock sug om du inte använder ett verktyg som hanterar det för dig som Valet.

Om du någonsin har försökt att köra en HTTPS-webbplats lokalt har du förmodligen sett något liknande i Chrome:

Lösningen brukade vara att skapa ett självsignerat certifikat och använda det. MAMP Pro gör detta åt dig och var min favorit i flera år. Tyvärr är det inte längre möjligt. Det moderna tillvägagångssättet är att bli din egen Certificate Authority (CA)!

Hur det fungerar

För att begära ett SSL-certifikat från en CA som Verisign eller GoDaddy skickar du dem ett certifikatsignering Begär (CSR), och de ger dig ett certifikat i gengäld som de undertecknade med sitt rootcertifikat och privata nyckel. Alla webbläsare har en kopia (eller tillgång till en kopia från operativsystemet) av Verisigns rotcertifikat, så att webbläsaren kan verifiera att ditt certifikat har undertecknats av en betrodd CA.

Det är därför när du skapar en själv- undertecknat certifikat litar inte webbläsaren på det. Det är självsignerat. Det har inte undertecknats av en CA. Men vi kan skapa vårt eget rotcertifikat och privata nyckel. Vi lägger sedan till rotcertifikatet till alla enheter vi äger bara en gång, och sedan är alla certifikat som vi genererar och signerar tillförlitliga.

Bli en (liten) certifikatutfärdare

Det är ganska löjligt hur enkelt det är att generera de filer som behövs för att bli certifikatutfärdare. Det tar bara två kommandon. Först genererar vi vår privata nyckel:

Du kommer att bli ombedd att ange en lösenfras, som jag rekommenderar att du inte hoppar över och håller dig säker. Lösenfrasen förhindrar alla som får din privata nyckel från att skapa ett eget rotcertifikat. Utdata ska se ut så här:

Sedan genererar vi ett rotcertifikat:

Du kommer att uppmanas att ange lösenfrasen för din privata nyckel (som du just valde) och en massa frågor. Svaren på dessa frågor är inte så viktiga. De dyker upp när man tittar på certifikatet, vilket du nästan aldrig kommer att göra. Jag föreslår att du gör det vanliga namnet till något som du kommer att känna igen som ditt rotcertifikat i en lista med andra certifikat. Det är egentligen det enda som betyder något.

Du bör nu ha två filer: myCA.key (din privata nyckel) och myCA.pem (ditt rotcertifikat ).

🎉 Grattis, du är nu CA. Sortera.

För att bli en riktig CA måste du skaffa ditt rootcertifikat på alla enheter i världen. Låt oss börja med de du äger.

Installera ditt rotcertifikat

Vi måste lägga till rotcertifikatet till alla bärbara datorer, stationära datorer, surfplattor och telefoner som kommer åt dina HTTPS-webbplatser. . Det här kan vara lite ont, men den goda nyheten är att vi bara behöver göra det en gång. När vårt rootcertifikat finns på varje enhet kommer det att vara bra tills det går ut.

Lägga till rotcertifikatet i macOS-nyckelring

Via CLI

Via användargränssnittet

1. Öppna macOS Keychain-appen
2. Gå till fil > Importera objekt …
3. Välj din privata nyckelfil (dvs. myCA.pem)
4. Sök efter vad du svarade som det vanliga namnet ovan
   
5. Dubbelklicka på ditt rotcertifikat i listan
6. Expandera Trust-sektionen
7. Ändra När du använder detta certifikat: välj rutan till ”Alltid Förtroende ”
   
8. Stäng certifikatfönstret
9. Det ber dig att ange ditt lösenord (eller skanna ditt finger), gör det
10. 🎉 Fira!

Lägga till rotcertifikatet till iOS

Om du vill lägga till rotcertifikatet till dina iOS-enheter kan du göra det ganska enkelt genom att följa dessa steg:

1. Skicka rotcertifikatet till dig själv så att du kan komma åt det på din iOS-enhet
2. Klicka på bilagan i e-postmeddelandet på din iOS-enhet
3. Gå till inställningsappen och klicka på ”Nedladdad profil” högst upp
4. Klicka på installera uppe till höger
5. När du är installerad, tryck på stäng och gå tillbaka till huvudsidan för inställningar
6. Gå till ”Allmänt” > ”Om”
7. Bläddra till botten och klicka på ”Certificate Trust Settings”
8. Aktivera ditt rotcertifikat under ”AKTIVER FULLT FÖRTROENDE FÖR ROTCERTIFIKAT”

Skapa CA-signerade certifikat för din Dev Sites

Nu när vi är CA på alla våra enheter kan vi underteckna certifikat för alla nya dev-webbplatser som behöver HTTPS. Först skapar vi en privat nyckel:

Sedan skapar vi en CSR:

Du får alla samma frågor som du gjorde ovan, och återigen, dina svar spelar ingen roll. Faktum är att de har betydelse ännu mindre eftersom du inte kommer att titta på detta certifikat i en lista bredvid andra.

Därefter skapar vi certifikatet använder vår CSR, den privata CA-nyckeln, CA-certifikatet och en konfigurationsfil, men först måste vi skapa den konfigurationsfilen.

Konfigurationsfilen behövs för att definiera SAN-tillägget (Subject Alternative Name) vilket definieras i detta avsnitt (dvs. tillägg) av certifikatet:

Konfigurationsfilen (dev.deliciousbrains.com. ext) innehöll följande:

Vi kör kommandot openssl x509 för enligt vad jag förstår, kommandot x509 behövs för att göra signeringen med rotcertifikatet och den privata nyckeln. Jag hittade det här konfigurationsfilen på Stack Overflow och det verkar fungera.

Nu kör vi kommandot för att skapa certifikatet:

Jag kan nu konfigurera min webbserver med den privata nyckeln och intyget. Om du kör en Linux-server kan du använda instruktionerna i vår Installera WordPress på Ubuntu 20.04-serien. Om du använder MAMP kan du välja certifikat och nyckelfiler med användargränssnittet:

MAMP (testad med version 5.7) skapar tyvärr inte SSL-certifikat med en CA, så du måste använda den manuella metoden för tillfället.

För andra dev-webbplatser kan vi bara upprepa den sista delen av att skapa ett certifikat, vi behöver inte skapa en ny CA för varje webbplats.

Shell-skript

För att göra saker ännu snabbare, här är ett praktiskt skalskript som du kan ändra för dina egna ändamål:

Slutsats

Så där har du det, hur du blir ditt eget lokala certifikat myndighet att underteckna dina lokala SSL-certifikat och använda HTTPS på dina lokala webbplatser. Förhoppningsvis kommer detta att eliminera det fruktade meddelandet ”Din anslutning är inte privat” för dig i Chrome.