We are self-hosting the NextJS app with an Nginx proxy. The streaming functionality allows for the suspense states to show up while the page is loading. I am aware this is available by default if the app is hosted on Vercel. How can I enable streaming to allow for the load states (Suspense) to show up while the page is loading?
1 Answer
This file, from an older commit on the official Next.js repo, details that you need to configure Nginx to disable buffering like this:
proxy_buffering off;
Below is the full sample configuration with the explanation in case the link is unavailable:
Streaming and Suspense
The Next.js App Router supports [streaming responses](/docs/app/building-your-application/routing/loading-ui-and-streaming) when self-hosting. If you are using Nginx or a similar proxy, you will need to configure it to disable buffering to enable streaming.
```nginx filename="nginx.conf"
server {
listen 80;
location / {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
# Disable buffering
proxy_buffering off;
}
}
This enables the loading states for the components.