"scripts": { "start": "HTTPS=true react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" },
Corrida yarn start
após esta etapa, você verá esta tela no seu navegador:
Nesta fase, você já está pronto para ir com https
. Mas como você não possui um certificado válido, sua conexão é considerada insegura.
Criando um certificado SSL
A maneira mais fácil de obter um certificado é via mkcert
.
# Install mkcert toolbrew install mkcert# Install nss (only needed if you use Firefox)brew install nss# Setup mkcert on your machine (creates a CA)mkcert -install
Depois de executar os comandos acima, você terá criado um autoridade de certificação na sua máquina, o que permite gerar certificados para todos os seus projetos futuros.
Da raiz do seu create-react-app
Agora, você deve executar:
# Create .cert directory if it doesn't existmkdir -p .cert# Generate the certificate (ran from the root of this project)mkcert -key-file ./.cert/key.pem -cert-file ./.cert/cert.pem "localhost"
Armazenaremos nossos certificados gerados no diretório .cert
diretório. Eles não devem estar comprometidos com o controle de versão; portanto, você deve atualizar seu .gitignore
para incluir o .cert
diretório.
Em seguida, precisamos atualizar o start
script novamente para incluir nosso certificado recém-criado:
"scripts": { "start": "HTTPS=true SSL_CRT_FILE=./.cert/cert.pem SSL_KEY_FILE=./.cert/key.pem react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" },
Quando você corre yarn start
novamente, agora você deve ver que sua conexão está segura.
Não seja um estranho! Sinta-se à vontade para escrever se tiver alguma dúvida – conecte-se comigo no Linkedin ou Siga me no twitter.