1

I'm working on a react app where the app needs to open on https://localhost:3000 but its opening on http://localhost:3000. I'm using windows OS and to make the app work I did the following

  1. generated the self signed certificate
  2. added it to the root level of the project
  3. my package json has
"start": "set HTTPS=true && set REACT_APP_GIT_VERSION=$(git rev-parse head) && react-scripts start",
"safeStart": "export HTTPS=true&&SSL_CRT_FILE=cert.pem&&SSL_KEY_FILE=key.pem react-scripts start",

  1. when i try to run the app by using npm start or set HTTPS=true&&npm start the app is up and opening in the browser but served on http but not on https.

  2. when i try to run the app using the npm safeStart or set HTTPS=true&&npm safeStart, i'm getting error at SSL saying its not configured.

I'm not sure if i'm missing something or i need to add some additional configs or so.

======================UPDATE====================

I made this work by doing the following,

  1. generated the ssl using https://www.npmjs.com/package/mkcert
  2. mapped the start command with reference to the key and file parameter
  3. "start": "set HTTPS=true&&set SSL_CRT_FILE=C:/Windows/System32/cert.crt&&set SSL_KEY_FILE=C:/Windows/System32/cert.key&&react-scripts start",
  4. now give npm start it should start the app on https://localhost:3000
Improve this question
5
  • 1
    Does this answer your question? create-react-app: how to use https instead of http? Commented Apr 26, 2024 at 9:58
  • @AndréLehto I did try these, but stills serves on http Commented Apr 26, 2024 at 10:18
  • "the app needs to open on https://localhost:3000"... why? Commented Feb 14 at 7:02
  • May be for learning purpose @Phil Commented Feb 14 at 7:53
  • @ArtBindu for what learning purpose then. Statements like that are almost always symptoms of XY problems. For example, the only thing I can think of is for SameSite=None;Secure cookie support but that's not necessary when you can use SameSite=Lax on localhost Commented Feb 14 at 8:32
Related questions
2375
How can I programmatically navigate using React Router?
1928
How do we control web page caching, across all browsers?
159
Vite https on localhost
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.