I have a React frontend and a Django backend, both organized in a docker-compose with port 7000 exposed to React, and port 9000 exposed to Django. This system is hosted in a server machine whose nginx location config is the following:
[...]
location / {
proxy_pass http://localhost:7000/;
}
location /django {
proxy_pass http://localhost:9000/;
}
[...]
Suppose the server_name is example.com.
The problem is: if I access example.com/django/admin, a blank react page is returned instead of the django-admin login one. How can I solve it?
Related
server{
listen 80 ;
listen [::]:80;
server_name test.demo.io;
root /home/ubuntu/SuperApp/build;
location / {
try_files $uri /index.html;
}
}
this is my nginx config file for frontend that is developed in react js.
I have also developed backed in express js.
Now how shall I deploy my express js backend code.?
Shall I keep these two projects separate and run the backend on port 3000 ? In that case, will I have to do additional things to connect my front end with this express js through apis? As both app are not running on same port?
Or shall I keep my front end in the express js static files and run the whole app from port 3000? but in that case how would I attach my current domain to the website as currently I haven't attach any port no like 3000 used.
Please help. I am new to this.
Front-end and back-end are two separate projects
you build the front-end adding api url as env var during the build process. you just deploy the static build result on Nginx server.
you run the api separately e.g on http://localhost:3000 using a command like npm start or node server.js depends on your back-end code
I need to serve a react app on a subpath domain http://domain.dev/myreactapp
And I can't find a configuration to serve the app using nginx.
I'm using the nginx docker container.
I already tried a lot of stuff but this is my conf right now.
server {
listen 80;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri /index.html;
}
}
The the big nginx instance points http://mydomain.dev/myreactapp to another server that will serve static files with nginx on a docker container (the nginx:1.16.0-alpine container)
My react app will only be served by that url, the top domain is pointing to another server.
But I can't make the app respond to the subpath.
If I ran the second docker image on my machine, it only respond to the top level.
I don't know what I need to set it up on the second nginx to serve the app on the http://mydomain.dev/myreactapp subpath.
I have React.js app which I created using create-react-app. Also I have Scala REST API which use Akka-HTTP. For build React app I use npm run build. I want that Scala send on client index.html with other static file. I started writing routes for static files, but this method has long been used and can today have something else to do it automatically. Can you advise me how to solve this problem?
Use Nginx. Serve the static npm-built files with that. Forward API requests to the scala app. Minimal example nginx config using URL path prefix to separate static and api.
upstream server-api {
server localhost:9000;
}
server {
listen 80;
server_name _;
location /api {
proxy_pass http://server-api;
}
location / {
root /usr/share/nginx/dist;
index index.html index.htm;
}
}
I am working on Angular 1 based web application.
I've deployed a web app with nginx , but couldn't deploy production server in my local env.
So, I want call API from the production server. For example,
I am using RestAngular to call API.
Restangular.all('api/user/profile').post(mUser)
This calls
localhost:8080/api/user/profile
because I've deployed a web app in localhost:8080.
I want to redirect requests which starts with "/API" to the production server, by config nginx properly.
So, in this case, it should call API server
http://devprod2api/api/user/profile
Other requests that don't start with "API" should go to:
http://localhost:8080/...
Is it something possible by config nginx properly? If possible, how can I do that?
I am not sure what you have tried, but this just needs a simple proxy_pass as far as I see. Add below to your nginx config and it should point all API to the other server. It assumes that a host entry is present for devprod2api
location /api/ {
proxy_pass http://devprod2api/api/;
}
I have:
DigitalOcean VPS
Meteor application with routing in Angular
Nginx as a reverse-proxy
SSL for my domain, configured with Nginx (also redirecting http to https)
another hosting (!) with Wordpress blog there
something doma.in with DNS set to DigitalOcean VPS and Meteor app is there
How can I "rewrite" doma.in/blog to the blog, but with this same URL? (without redirect).
Try this nginx configuration:
location ^/blog {
rewrite /blog(.*) $1 break; #cut the /blog path
proxy_pass http://blog.com:8000; #then pass it to the blog domain/port
proxy_redirect off; #without redirecting
proxy_buffering off; #or buffering
}
As for angular, it simply needs to avoid/skip the route, as discussed here on SO