"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:

privacy error

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.

secure

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.