1

I'm trying to use https on local dev for a 'create-react-app'. I used this site as a tutorial for creating the certificate and got windows to trust it: https://zeropointdevelopment.com/how-to-get-https-working-in-windows-10-localhost-dev-environment/

This is my .env file.

SSL_CRT_FILE=client-1.local.crt
SSL_KEY_FILE=client-1.local.key
HTTPS=true

And this is my package.json

...
"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
...

After, I use the

npm start

command, and go to https://localhost:3000/

  • On Firefox I receive a

Secure Connection Failed" error with very few details "An error occurred during a connection to localhost:3000.PR_CONNECT_RESET_ERROR

  • On Chrome I receive

The connection was reset

I also checked this post create-react-app: how to use https instead of http? but i didn't see anything that could have helped me. I have windows 10.

Any ideas ? Thank you

bluesony
  • 459
  • 1
  • 5
  • 28
  • make sure you are running the right command "npm run start:env", secondly have you tried "HTTPS=true SSL_CRT_FILE=cert.crt SSL_KEY_FILE=cert.key npm start " ? – Hamid Jan 25 '21 at 00:00
  • 1
    i tried both "npm start" and "npm run start:env". No difference. I removed the "start:env" from the "package.json" since this should work with "npm start" by default. I also tried to add the certificate file and key in the "package.json" insead of having them inside an ".env" file. Since i use windows (i updated also the question because i forgot about this) the command was a bit different : "set HTTPS=true&&set SSL_CRT_FILE=client-1.local.crt&&set SSL_KEY_FILE=client-1.local.key&&react-scripts start". But even so, no difference in the result – bluesony Jan 25 '21 at 08:12
  • 1
    I added them also directly in the command as "set HTTPS=true&&set SSL_CRT_FILE=client-1.local.crt&&set SSL_KEY_FILE=client-1.local.key&&npm start". But still same result – bluesony Jan 25 '21 at 08:16

2 Answers2

1

following the solution in the official create-react-app website you should run :

set HTTPS=true&&npm start

this will run "npm start" for you and the browsers should allow you to view the page

0

I had a similar issue with Edge. and here's how I solved it,

  1. In edge browser type URL:- edge://net-internals/#hsts
  2. on "Delete domain security policies" enter "localhost" and press "delete".
  3. Reopen localhost:3000/

*chrome also have a similar link chrome://net-internals/#hsts