Nuxt Image (_ipx) Not Working Externally with PM2 & Nginx
I'm running a Nuxt 3 app in production using PM2 (cluster mode) and Nginx as a reverse proxy. When making internal requests (curl -I http://localhost:3000/ipx//logo/my-image.png), the image loads fine. However, when accessing externally (https://app.xyz.com/ipx//logo/my-image.png), I get a 404 Not Found error.
This issue occurs only in production on external requests. But on internal request no issues. In development (npm run dev), images work fine.
Steps to Reproduce:
Start a Nuxt app with @nuxt/image using pm2 in cluster mode:
pm2 start ecosystem.config.js
Set up Nginx as a reverse proxy:
`server { listen 80; server_name app.xyz.com;
location / {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location /_ipx/ {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
Try accessing the image:
Works locally:
curl -I http://localhost:3000/_ipx/_/logo/my-image.png
Fails externally:
curl -I https://app.xyz.com/_ipx/_/logo/my-image.png
I've got the same problem but can't reproduce it when using a cloudflare tunnel but on my production server which uses HAProxy/PM2 it doesn't work anymore. I have a click handler on the images to download them.
pnpm dev --tunnel : images can be downloaded
pnpm build && node .output/server/index.mjs and pnpm untun tunnel : images can be downloaded
tar cf output.tar .output && scp remotehost && unpack && pm2 start webapp : images can't be download, path to the image doesn't have the /_ipx/_/ part.
Manually adding the /_ipx/_/ part into the url downloads/show the image.
------------------------------
- Operating System: Linux
- Node Version: v22.12.0
- Nuxt Version: 3.15.1 tried with 3.15.4
- CLI Version: 3.22.2
- Nitro Version: 2.10.4
- Package Manager: [email protected]
- Builder: -
- User Config: modules, devtools, app, future, experimental, compatibilityDate, nitro, eslint, image, security, vite
- Runtime Modules: @nuxt/[email protected], @nuxt/[email protected], [email protected], @nuxt/[email protected]
- Build Modules: -
------------------------------
Ok, I now have it working again, no idea what fixes it, seems rather flaky, will keep an eye on it.
@Trevor-Okwirri does the issue still occur for you?
@puzzle-it-nu mentioned that the issue is no more so I wonder if the issue is still there for you? :)