404 on Dockerized react app endpoints url

Troubleshooting and help
,
1

Hello,

I have a 404 error (not found) when i refreshing my url on all endpoints for example https://website.com/publication/. If i refreshing on my base url https://website.com/, it’s ok.

I have a dockerized React app with vite.js, i’m building my app with vite build .
nginx for serving my app.

this is my dockerfile :
image

and my very simple nginx.conf:

server {
    listen 80;

    location / {
        root /usr/share/nginx/html;
        index index.html;
        try_files $uri $uri/ /index.html;
    }
}

koyeb is correctly setup for docker deploy (private registry):
port 80; Protocol : HTTP; Path: /

Thank you !

2

Hello Vincent,

I’m not sure to completely understand your problem.

From what I understand, you have a vite.js application which is rendering some static files, and you would like to serve these files with nginx. Is it correct?

What do you mean by “when I refresh my URL on all endpoints”?

3

Yes this is correct,
I mean when i reload my page on the web, i’ve got a 404 error but only when my url is like https://example.com/endpoint/
no 404 when i’m on base url

4

Is your application opensource by any chance? I could try to replicate the issue and tell your what’s wrong with it

5

@Vincent_Lembo Did you find a solution? I’m facing the same issue.

6

The most common fix for this issue is the base in vite.config.js not being '/', if you’re using a vite.config.js set it to:

export default {
  base: '/',
}

If you don’t have a vite.config.js, Vite defaults to base: '/', so the issue is likely somewhere else. In that case, could you share your nginx.conf and Dockerfile so I can take a closer look?