Secure Sockets Layer (SSL) on suojausprotokolla, joka muodostaa suojatun linkin palvelimen ja asiakkaan välille. Se on osa HTTPS-protokollaa, joka suorittaa tietojen salauksen. SSL on tärkeä, koska se suojaa tietoja salakuuntelulta ja siihen liittyviltä hyökkäyksiltä.
Oletuksena, jos luot React-sovelluksen käyttämällä luo-react-sovellusta, sovellus ei käytä HTTPS: ää. HTTPS: n ottaminen käyttöön sovelluksessasi on hyödyllistä varsinkin, jos aiot lähettää välityspyyntöjä API: lle, joka palvelee niitä HTTPS: n kautta.
HTTPS: n käyttö Reactissa
Kun sinä luo sovellus käyttämällä luo-react-sovellusta, se toimii oletuksena HTTP: llä. Jos haluat käyttää SSL: ää ja palvella sivuja HTTPS: n kautta, sinun on asetettava HTTPS muuttuja tosi package.json. Tee se muokkaamalla scripts.start arvo näyttää tältä:
"skriptit": {
"alkaa": "HTTPS=totta reagoi-skriptit alkavat",
},
Vaihtoehtoisesti voit asettaa HTTPS ympäristömuuttujan arvoksi tosi, kun käynnistät sovelluksen.
Linuxissa/macOS: ssä:
HTTPS=totta npm aloitus
Windows cmd: ssä:
aseta HTTPS=totta&&npm alkaa
Windows Powershellissä:
($env: HTTPS = "totta") -ja (npm aloitus)
Jokainen lähestymistapa on kuitenkin vasta ensimmäinen askel. Jos yrität käynnistää React-sovelluksesi tässä vaiheessa, saat virheilmoituksen. Prosessin viimeistelemiseksi sinun on määritettävä kelvollinen SSL-sertifikaatti.
Luo varmentaja koneellesi
Yksi työkaluista, joita voit käyttää SSL-varmenteen luomiseen, on mkcert. Sen avulla voit luoda paikallisesti testattuja kehitysvarmenteita ilman konfigurointia.
Se on yhteensopiva useiden alustojen kanssa ja toimii Windowsissa, Linuxissa ja macOS: ssä. Tämä artikkeli käyttää Linuxia.
Etsi käyttämäsi alustan asennusopas osoitteesta mkcert GitHub -sivu.
Aloita asentamalla certutil.
sudo apt Asentaa libnss3-työkalut
Sitten voit asentaa mkcert käyttämällä Homebrew'ta
hautua Asentaa mkcert
Luo paikallinen varmenneviranomainen (Ca) suorittamalla seuraava komento.
mkcert -Asentaa
Kun CA on luotu onnistuneesti, voit nyt aloittaa SSL-varmenteiden luomisen.
Luo SSL-sertifikaatti
Siirry React-sovelluksesi juurikansioon ja luo SSL-varmenne.
Luo ensin kansio varmennetta varten.
mkdir reactcert
Luo varmenne ja tallenna se juuri luomaasi kansioon suorittamalla seuraava.
mkcert -avaintiedosto ./reactcert/key.pem -cert-tiedosto ./reactcert/cert.pem "paikallinen isäntä"
Määritä React käyttämään SSL: ää
Lisää tiedostoon package.json polku, joka osoittaa SSL-varmenteille.
"skriptit": {
"alkaa":
"HTTPS=tottaSSL_CRT_FILE=./reactcert/cert.pem SSL_KEY_FILE=./reactcert/key.pem reagoi-skriptit alkavat"
}
Suojaa React-sivustosi SSL: n avulla
Tämä artikkeli osoitti, kuinka voit käyttää SSL-varmenteita paikallisessa React-ympäristössä. SSL-sertifikaatit ovat kuitenkin välttämättömiä kaikille verkkosovelluksille. Ne suojaavat verkkosivustoasi hakkereilta ja suojaavat sivustollasi vierailevien käyttäjien tietoja.