Fquer
Fquer

Reputation: 21

Setup nginx for react application with spring backend

we are trying to do run react app with nginx but we cant react backend api from react app.

enter image description here

here is my config

enter image description here

enter image description here

for docker start

docker run -d -p 3333:80 -m 3g --name gagu-react gagu-react:latest

then running this commands after the docker is running.

docker cp spring.conf gagu-react:/etc/nginx/conf.d/spring.conf

docker exec gagu-react nginx -s reload

its shows successful, i verified the using cat to file its shows right config

Successfully copied 2.05kB to gagu-react:/etc/nginx/conf.d/spring.conf

2023/11/05 18:53:49 [notice] 11#11: signal process started

its gagu-react docker logs

2023/11/05 18:57:58 [error] 19#19: *3 open() "/usr/share/nginx/html/api/gameType/getAll" failed (2: No such file or directory), client: xxx.xxx.43.153, server: localhost, request: "GET /api/gameType/getAll HTTP/1.1", host: "xx.xxx.xxx.1:3333", referrer: "http://xx.xxx.xxx.1:3333/" 159.146.43.153 - - [05/Nov/2023:18:57:58 +0000] "GET /api/gameType/getAll HTTP/1.1" 404 555 "http://xx.xxx.xxx.1:3333/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36" "-"

anyone can help us ?

Upvotes: 0

Views: 617

Answers (1)

user2907318
user2907318

Reputation: 58

Setup nginx for react application with spring backend

I think the configuration is wrong. Typically, inside the /etc/nginx/conf.d there's also the file default.conf that is configured to listen to the port 80. Currently it is answering with the files inside the /usr/share/nginx/html folder.

To fix the problem, you need to:

  1. update the default.conf and add also the proxy pass of your api ( as in the spring.conf );
  2. delete the spring.conf file.

You should try with a configuration like this:

server {
        listen 80;
        listen [::]:80;

        root /usr/share/nginx/html;
        index index.html index.htm;

        location / {
                try_files $uri $uri/ =404;
        }
    location /api {
        proxy_pass http...
        proxy_set_header...
        }
}

Upvotes: 0

Related Questions