uses nginx as a proxy to forward api and static resources . The foreground application is the react application, which can be accessed normally, but when a specific functional page of is refreshed, it gets 404 . If you do not refresh, there is no problem. If the react application and nginx are deployed together, you only need to set
location /
{
try_files $uri /index.html;
}
is fine. Now the react application and nginx are deployed separately. The past is proxied through proxy_pass . So how should I configure it?
nginx configuration
server {
listen 80;
server_name localhost eoms.xxx.com;
access_log /var/log/nginx/eoms.access.log;
location /api/ {
proxy_set_header Host $host:$server_port;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://api-eoms/public/index.php/api/;
client_max_body_size 512m;
client_body_buffer_size 1024k;
proxy_connect_timeout 100;
proxy_send_timeout 100;
proxy_read_timeout 100;
fastcgi_read_timeout 180;
proxy_buffer_size 8k;
proxy_buffers 128 64k;
proxy_busy_buffers_size 128k;
proxy_temp_file_write_size 128k;
}
location / {
proxy_redirect off;
proxy_set_header Host $host:$server_port;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://ui-eoms;
}
}
deployed by the docker used by ps:. Ui-eoms is a react application deployed with httpd. Because the react application has only one index.html entry file. So 404
appears when other addresses are requested.