Using nginx reverse proxy for hosting both frontend and plugin backend

[kiyo921]

I am trying to deply my plugin backend and frontend next.js app (landing page) using the same custom domain.

nginx.conf

events {}

http {
    server {
        listen 8080;

        location / {
            proxy_pass http://localhost:3000; # Next.js frontend
        }

        location ~ ^/(collect|ask|docs|openapi.json|sub|legal) {
            proxy_pass http://localhost:8000; # FastAPI backend
        }
    }
}

While the next.js frontend is working, the fastapi backend doesn’t work from chatGPT (event though fastapi /docs API endpoints are working fine).

The error from UI isn’t super helpful either. Does anyone have any clues of what might be wrong?

[nicholas.lopezk94]

Unless you have strong ties to nginx have you tried looking into

http-proxy

It is super simple, and gets the job done. Since you are using JS for front and backend you might as well use JS for the reverse proxy.