I'm running a very basic react app on Heroku and would like to force https on the production server, while still running localhost on https. I cannot for the life of me figure out how to do this on Heroku.
SSL and domain has been setup and works fine when I manually enter https:// before the domain. But if I manually type http:// this also works.
How do I redirect all http traffic to https for my react app on Heroko. I would like this to happen:
localhost:3000 still works in development
https is forced on production domain
create-react-app still runs without being "ejected"
Typically I'd set this up on the DNS, but Heroku only allows for a CNAME setup, so I cannot do this on the DNS level. I assume a custom server is required like express, but I cannot find any documentation on how to do this for production while stille working normally in development/localhost.
Related
I start my React app using:
npm start
This starts the app on localhost:3000
I would like to have it start with a domain instead of localhost. When testing locally, I have a local domain (example mydomain.com) set to IP address 127.0.0.1. This allows me to use the actual domain in code when making requests to the backend. Without this, my code would need to support both localhost and my domain and swap them out in production.
npm start is only a command to run your react app in development mode.. for faster build and publish functionalities..
So for production, you will be using npm build to get a production build for the same. This won;t be automatically deplyed or hosted on your localhost:3000.
So production deployment you will have to host your compiled build files using IIS or some hosting application. There you can configure your preferred DNS, whcihever domain name you would want to use.
You can customise the url for deployment for development.
In your .env.development add this line
HOST='mydomain.com'
If you want to deploy at https, add this line also in same file
HTTPS=true
We're developing a web app in React using create-react-app. The backend is written in Python and therefore we define a proxy in package.json to forward API calls to it during development as described here.
This, however, seems to interfere with the live reloading of the React development server when a source file is modified. In the Browser console we see:
The development server has disconnected.
Refresh the page if necessary.
And the backend server sees unexpected requests:
127.0.0.1 - - [22/May/2019 08:01:38] "GET /sockjs-node/227/inixucqn/websocket HTTP/1.1" 401 -
Is there any way to fix this? I guess we could configure the proxy manually, but this must be a problem everyone has when using proxy.
I am using Keycloak authorization server with React hosted via ASP.NET and Webpack. When I do a build and host through ASP.NET I have no problems with getting authorized methods on the host. When I deploy the whole project on the server there are also no problems with React connecting to the host. But when I am trying to do localhost development with Webpack proxy to my remote server, than I recieve 302 redirection to Keycloak login page. I log into the deployed app before the fetch, but it looks like the proxy is not recognized as the same browser. I have the 'credentials':'include' statement in my fetch init.
The problem was with Kestrel-Keycloak and http/https security. It appears that when you use a proxy like Nginx, Kestrel doesn't copy the headers. The problem can by solved by using:
app.UseForwardedHeaders
in Startup class, Configure method.
I wish to know how I can use a secure connection (https) with Dart and Managed VM's on localhost and when it's deployed.
Thank you.
When an application is deployed using gcloud preview app deploy the default is that the App Engine application will be served on both HTTP and HTTPS. If you have an application on
http://project.appspot.com
you can access it using HTTPS on
https://project.appspot.com
If not accessing the default version the URL are:
http://version.project.appspot.com
and HTTPS on
https://version-dot-project.appspot.com
Note the first . changing to -dot-.
You can specify the following int the app.yaml to only serve the application over HTTPS:
- url: /.*
script: dummy
secure: always
This will also redirect from HTTP to HTTPS, but unfortunately not do the rewrite from . to -dot- if not using the default version.
For local development using gcloud preview app run it is not possible to use HTTPS. The following quote is from the App Engine documentation:
The development web server does not support HTTPS connections. It
ignores the secure parameter, so paths intended for use with HTTPS can
be tested using regular HTTP connections to the development web
server.
See https://github.com/dart-lang/appengine/issues/16 and https://cloud.google.com/appengine/docs/python/config/appconfig#Python_app_yaml_Secure_URLs.
How do I connect between two App Engines?
I want to run a custom runtime with nginx for serving my frontend files and an other App Engine serving the backend with nodejs.
In my "one server setup" i use nginx to proxy everything from /api/ to localhost:3000 (my node instance)
I think i could start the Backend, look up the internal ip and proyx to that but i'd guess thats not the right way and it wouldn't allow me to test locally with gcloud app run.