问题
I want to run two different js apps on my Nginx server. My problem is that I want to enable the React app on the main URL /
on port 3000 and different js app on port 1337.
When I set React App on the main URL it's working properly but any application on different URL like /admin
that loads the second app it's not loaded properly. I have changed the paths and now I have my second app on main URL /
and it's working properly but when I run React app on /admin
URL it cannot load files properly.
How to connect two js apps on different locations using Nginx?? I am using react-react-app and create-strapi-app. You can check this on IP: http://51.178.80.233/ and client: http://51.178.80.233/client
Working example works without two root
lines on each location.
My config on sites-enabled/default
:
root /var/www/jozefrzadkosz-portfolio.pl;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name _;
location /client {
# First attempt to serve request as file, then
#as directory, then fall back to displaying a 404.
root /var/www/jozefrzadkosz-portfolio.pl/client;
proxy_pass http://localhost:3000; #whatever port your app runs on
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
location / {
root /var/www/jozefrzadkosz-portfolio.pl/strapi;
proxy_pass http://localhost:1337;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
回答1:
Here are some considerations about proxying application under some URI prefix, for example, /admin/
.
Use correct location prefix and proxy_pass URL parameter. When you use configuration
location /admin { ... proxy_pass http://localhost:3000; }
request
http://example.com/admin/some/path
will be passed to upstream as is, i.e.http://localhost:3000/admin/some/path
, which is probably wrong. If you want this request to be passed to upstream ashttp://localhost:3000/some/path
, you must use an URI part when you specify an upstream address:location /admin/ { ... proxy_pass http://localhost:3000/; }
Look at this answer for more details about this behavior.
All URLs generated by application (for assets, pages and so on) must be either relative or include
/admin
prefix. Otherwise they wouldn't be processed whithin our location block. This is non-trivial task which depends on application type, look at this question for react applications (official documentation here). Unfortunaly I know nothing about strapi applications. If you can't affect application URLs generation mechanism, the only way left is to substitute URLs in the response body with the ngx_http_sub_module (looks like quite an ugly solution for me).
来源:https://stackoverflow.com/questions/59993875/how-to-run-two-js-apps-on-different-url-with-nginx