Det kan være vanskelig å sette opp HTTPS lokalt. Selv om du klarer å bryte selvsignerte sertifikater til innsending, ender du fortsatt med nettleserens personvernfeil. I denne artikkelen går vi gjennom å lage ditt eget sertifikatmyndighet for dine lokale servere, slik at du kan kjøre HTTPS-nettsteder lokalt uten problemer.

Hvorfor HTTPS lokalt?

Hvorfor ikke bare bruke vanlig HTTP lokalt? For hvis produksjonsstedet ditt bare er HTTPS og du utvikler deg lokalt på vanlig HTTP, er ikke utviklings- og produksjonsmiljøene dine like like som de kunne være. For eksempel kjører mitt dev-miljø for dette nettstedet (deliciousbrains.com) som en Ubuntu-server i en virtuell VMware-maskin (VM) på sin Mac. Produksjonsstedet er en Ubuntu-server som kjører på Linode med en nesten identisk konfigurasjon.

Du vil absolutt at ditt dev-miljø skal speile produksjonen så tett som mulig.
Når den ikke gjør det, inviterer du flere problemer dukker opp i produksjon som ikke dukket opp i dev. Å kjøre HTTP når produksjonsstedet ditt bare er HTTPS, er definitivt en unødvendig risiko.

Å prøve å få et SSL-sertifikat som fungerer sammen med den lokale serveren, suger hvis du ikke bruker et verktøy som håndterer det for deg som Valet.

Hvis du noen gang har prøvd å kjøre et HTTPS-nettsted lokalt, har du sannsynligvis sett noe som følgende i Chrome:

Løsningen pleide å være å lage et selvsignert sertifikat og bruke det. MAMP Pro gjør dette for deg og var min favoritt i årevis. Dessverre er det ikke lenger mulig. Den moderne tilnærmingen er å bli din egen Certificate Authority (CA)!

Hvordan det fungerer

For å be om et SSL-sertifikat fra en CA som Verisign eller GoDaddy, sender du dem en Certificate Signing Forespørsel (CSR), og de gir deg et sertifikat i retur som de signerte ved hjelp av rotsertifikatet og den private nøkkelen. Alle nettlesere har en kopi (eller får tilgang til en kopi fra operativsystemet) av Verisigns rotsertifikat, slik at nettleseren kan bekrefte at sertifikatet ditt ble signert av en klarert CA.

Det er derfor når du genererer et selv- signert sertifikat nettleseren ikke stoler på. Det er selvsignert. Den er ikke signert av en CA. Men vi kan generere vårt eget rotsertifikat og private nøkkel. Vi legger deretter til rotsertifikatet til alle enhetene vi eier bare en gang, og deretter vil alle sertifikater som vi genererer og signerer, iboende være klarert.

Bli en (liten) sertifikatmyndighet

Det er litt latterlig hvor enkelt det er å generere filene som trengs for å bli sertifikatmyndighet. Det tar bare to kommandoer. Først genererer vi vår private nøkkel:

Du blir bedt om å oppgi en passordfrase, som jeg anbefaler ikke å hoppe over og holde deg trygg. Passordet vil forhindre alle som får din private nøkkel fra å generere et eget rotsertifikat. Utdata skal se slik ut:

Så genererer vi et rotsertifikat:

Du blir bedt om passfrasen til din private nøkkel (som du nettopp valgte) og en haug med spørsmål. Svarene på disse spørsmålene er ikke så viktige. De dukker opp når du ser på sertifikatet, noe du nesten aldri vil gjøre. Jeg foreslår at du gjør det vanlige navnet til noe du vil gjenkjenne som rotsertifikatet ditt, i en liste over andre sertifikater. Det er egentlig det eneste som betyr noe.

Du bør nå ha to filer: myCA.key (din private nøkkel) og myCA.pem (ditt rotsertifikat ).

🎉 Gratulerer, du er nå CA. Slags.

For å bli en ekte CA, må du skaffe rotsertifikatet ditt på alle enhetene i verden. La oss starte med de du eier.

Installere rotsertifikatet ditt

Vi må legge til rotsertifikatet til alle bærbare datamaskiner, stasjonære datamaskiner, nettbrett og telefoner som skal få tilgang til HTTPS-nettstedene dine. . Dette kan være litt vondt, men den gode nyheten er at vi bare trenger å gjøre det en gang. Når rotsertifikatet vårt er på hver enhet, vil det være bra til det utløper.

Legge til rotsertifikatet i macOS nøkkelring

Via CLI

Via brukergrensesnittet

1. Åpne macOS nøkkelring-appen
2. Gå til fil > Importer elementer …
3. Velg din private nøkkelfil (dvs. myCA.pem)
4. Søk etter det du svarte som navnet på det vanlige navnet ovenfor
   
5. Dobbeltklikk på rotsertifikatet ditt i listen
6. Utvid Trust-delen
7. Endre Når du bruker dette sertifikatet: velg boksen til «Alltid Stol på ”
   
8. Lukk sertifikatvinduet
9. Den vil be deg om å oppgi passordet ditt (eller skanne fingeren), gjør det
10. 🎉 Feir!

Legge til rotsertifikatet til iOS

Hvis du vil legge til rotsertifikatet til iOS-enhetene dine, kan du gjøre det ganske enkelt ved å følge disse trinnene:

1. Send rotsertifikatet til deg selv slik at du får tilgang til det på din iOS-enhet
2. Klikk på vedlegget i e-posten på din iOS-enhet
3. Gå til innstillingsappen og klikk ‘Profil nedlastet’ øverst
4. Klikk installer øverst til høyre
5. Når du er installert, trykk lukk og gå tilbake til hovedsiden Innstillinger
6. Gå til «Generelt» > «Om»
7. Bla til bunnen og klikk på «Certificate Trust Settings»
8. Aktiver rotsertifikatet ditt under «AKTIVER FULLTILLIT FOR ROTSERTIFIKATER»

Opprette CA-signerte sertifikater for din Dev Sites

Nå som vi er en CA på alle enhetene våre, kan vi signere sertifikater for alle nye dev-nettsteder som trenger HTTPS. Først oppretter vi en privat nøkkel:

Deretter lager vi en CSR:

Du får alle de samme spørsmålene som du gjorde ovenfor, og igjen, svarene dine har ikke noe å si. Faktisk betyr de enda mindre fordi du ikke ser på dette sertifikatet i en liste ved siden av andre.

Deretter oppretter vi sertifikatet. ved å bruke vår CSR, den private CA-nøkkelen, CA-sertifikatet og en konfigurasjonsfil, men først må vi opprette den konfigurasjonsfilen.

Konfigurasjonsfilen er nødvendig for å definere SAN-utvidelsen (Subject Alternative Name) som er definert i denne seksjonen (dvs. utvidelse) av sertifikatet:

Konfigurasjonsfilen (dev.deliciousbrains.com. ekst) inneholdt følgende:

Vi kjører kommandoen openssl x509 fordi etter hva jeg forstår, kommandoen x509 er nødvendig for å gjøre signeringen med rotsertifikatet og den private nøkkelen. Jeg fant dette eksempelkonfigurasjonsfilen på Stack Overflow, og det ser ut til å fungere.

Nå kjører vi kommandoen for å opprette sertifikatet:

Jeg kan nå konfigurere webserveren min med den private nøkkelen. og sertifikatet. Hvis du kjører en Linux-server, kan du bruke instruksjonene i installere WordPress på Ubuntu 20.04-serien. Hvis du bruker MAMP, kan du velge sertifikat og nøkkelfiler ved hjelp av brukergrensesnittet:

MAMP (testet med versjon 5.7) oppretter dessverre ikke SSL-serier med en CA, så du må bruke den manuelle metoden for nå.

For andre dev-nettsteder kan vi bare gjenta denne siste delen av å opprette et sertifikat, vi trenger ikke opprette en ny CA for hvert nettsted.

Shell-skript

For å gjøre ting enda raskere, her er et praktisk shell-skript du kan endre for dine egne formål:

Konklusjon

Så der har du det, hvordan du blir ditt eget lokale sertifikat myndighet til å signere dine lokale SSL-sertifikater og bruke HTTPS på dine lokale nettsteder. Forhåpentligvis vil dette eliminere den fryktede meldingen «Din forbindelse er ikke privat» i Chrome.