nginx in rc.12 no more proxy_pass infinity loading

[andysay]

Environment

---

• Operating System: Linux
• Node Version: v16.13.0
• Nuxt Version: 3.0.0-rc.12
• Nitro Version: 0.6.0
• Package Manager: npm@8.15.1
• Builder: vite
• User Config: modules, vue, runtimeConfig, css, buildModules, build
• Runtime Modules: @nuxtjs/tailwindcss@5.3.5
• Build Modules: @pinia/nuxt@0.4.3

---

Reproduction

server
{
    listen 80;
    listen [::]:80;
    server_name site.dev www.site.dev;

    location /
    {
        proxy_pass http://127.0.0.1:3001;
        include /etc/nginx/proxy_params;
    }
}

params

proxy_buffers 16 32k;
        proxy_buffer_size 64k;
        proxy_busy_buffers_size 128k;
        proxy_cache_bypass $http_pragma $http_authorization;
        proxy_connect_timeout 59s;
        proxy_hide_header X-Powered-By;
        proxy_http_version 1.1;
        proxy_ignore_headers Cache-Control Expires;
        proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504 http_404;
        proxy_no_cache $http_pragma $http_authorization;
        proxy_pass_header Set-Cookie;
        proxy_read_timeout 600;
        proxy_redirect off;
        proxy_send_timeout 600;
        proxy_temp_file_write_size 64k;
        proxy_set_header Accept-Encoding '';
        proxy_set_header Cookie $http_cookie;
        proxy_set_header Host $host;
        proxy_set_header Proxy '';
        proxy_set_header Referer $http_referer;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Original-Request $request_uri;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;

Describe the bug

infinity loading.

Additional context

No response

Logs

No response

[levidavidmurray]

These proxy_params seem to have fixed the infinite loading, but I'm seeing response times of up to 5 seconds in dev environment... (prod build)

This seems to have started with this commit (nuxt/framework@5a2616c) that added support for early hint rendering (status code 103).

Note the header differences between a direct connection to the nitro server versus an nginx proxy_pass

# =========== direct nitro connection =========== 
levi@Levi-PC:~/Code/gh/nuxt-rc-13-app$ curl -s -D - -o /dev/null http://localhost:3000
HTTP/1.1 103 Early Hints
Link: </_nuxt/entry.41705590.js>; rel="modulepreload"; as="script"; crossorigin, </_nuxt/error-component.3ac342b2.js>; rel="prefetch"; as="script"; crossorigin

HTTP/1.1 200 OK
Content-Type: text/html;charset=UTF-8
X-Powered-By: Nuxt
Server-Timing: -;dur=0;desc="Generate"
Date: Wed, 19 Oct 2022 09:21:06 GMT
Connection: keep-alive
Keep-Alive: timeout=5
Content-Length: 702

# =========== nginx proxy_pass =========== 
levi@Levi-PC:~/Code/gh/nuxt-rc-13-app$ curl -s -D - -o /dev/null http://localhost
HTTP/1.1 103 Early Hints
Server: nginx/1.18.0 (Ubuntu)
Date: Wed, 19 Oct 2022 09:20:57 GMT
Connection: keep-alive
Link: </_nuxt/entry.41705590.js>; rel="modulepreload"; as="script"; crossorigin, </_nuxt/error-component.3ac342b2.js>; rel="prefetch"; as="script"; crossorigin

HTTP/1.1 200 OK
Content-Type: text/html;charset=UTF-8
X-Powered-By: Nuxt
Server-Timing: -;dur=0;desc="Generate"
Date: Wed, 19 Oct 2022 09:20:57 GMT
Connection: close

^C

I'm sure there's an ideal proxy_pass config to support this, but I frankly just don't have the patience for it as this feature isn't important to me. I just ended up disabling experimental.writeEarlyHints in nuxt.config.ts:

export default defineNuxtConfig({
  ...
  experimental: {
    writeEarlyHints: false,
  },
  ...
})

[vanling]

I can confirm my simple nginx deployments are also breaking.
The writeEarlyHints @levidavidmurray said above 'fixes' this.

very basic nginx conf

location / {
        proxy_pass http://localhost:3002;
        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;
    }

error in logs

2022/10/19 13:46:14 [error] 751033#751033: *1157 upstream sent too big header while reading response header from upstream, client: 217.123.2.162, server: ********.nl, request: "GET / HTTP/1.1", upstream: "http://127.0.0.1:3002/", host: "********.nl"

[jgupta]

We are unable to make Nginx work with early hints. Either we disable nginx http2 (which would disable early hints anyway) or disable it in nuxt config via writeEarlyHints

We keep getting error ERR_HTTP2_PROTOCOL_ERROR in chrome.

[jgupta]

upstream sent too big header while reading response header from upstream

Since link header would be large, proxy buffers should be increased or disable buffering all together. There is however some other issue too.

[websaxophone]

+1

[kosmeln]

We are experiencing the same issue - our Nginx config with proxy is broken as well. Ended up with disabling the early hints

[westberliner]

Can confirm as well. Disabling it worked.

[egidiusmengelberg]

I was having the same issue when deploying to kubernetes with a nginx-ingress.

Kept getting ERR_HTTP2_PROTOCOL_ERROR as @jgupta described.

Disabling experimental.writeEarlyHints worked!

[lucassimines]

I was having the same issue when deploying to kubernetes with a nginx-ingress.

Kept getting ERR_HTTP2_PROTOCOL_ERROR as @jgupta described.

Disabling experimental.writeEarlyHints worked!

It worked for me too

[misaon]

@danielroe It might be a good point to add recommended settings for Nginx (proxy) to the documentation.

[Suniron]

Omg ! I was stucked all this afternoon with a very long first loading of my app (more than 60s) in production since i've update my dependencies (and many code).

You may save my life 😱.

I hope this fix works, I'll try this Monday 🤞