Configure varnish for my app that has already proxy_pass in nginx

Question

I'm trying to figure out how to configure my website to pass thru varnish. I'm using Ubuntu 18.04. I've tried some methods I already found online, but I can only make it work for HTTP, not for HTTPS. Here is my actual nginx.conf. My website is built in React and as you can see I already have a proxy_pass in my Nginx.

        listen 80;
        listen [::]:80;
        return 301 https://$host$request_uri;
}

server {
        # SSL configuration
        listen 443 ssl http2;
        listen [::]:443 ssl http2;

        include snippets/ssl-params.conf;
        client_max_body_size 15M;
        ssl_certificate_key  /srv/www/dev.site.com/ssl/dev.key;
        ssl_certificate  /srv/www/dev.site.com/ssl/dev.chain.crt;

        access_log /srv/www/dev.site.com/logs/temp_access.log;
        error_log /srv/www/dev.site.com/logs/temp_error.log;

        error_page 502 /502.html;
        location = /502.html {
           root /usr/share/nginx/html/;
           allow all;
           internal;


        }


#        root /srv/www/dev.site.com/html;
#        index index.php index.html;

        server_name www.dev.site.com dev.site.com;

        location / {

          proxy_pass            http://127.0.0.1:3000/;
          proxy_http_version    1.1;
          proxy_set_header      Host             $host;
          proxy_set_header      X-Real-IP        $remote_addr;
          proxy_set_header      X-Forwarded-For  $proxy_add_x_forwarded_for;
          proxy_set_header      X-Client-Verify  SUCCESS;
          proxy_set_header      X-Client-DN      $ssl_client_s_dn;
          proxy_set_header      X-SSL-Subject    $ssl_client_s_dn;
          proxy_set_header      X-SSL-Issuer     $ssl_client_i_dn;
          proxy_read_timeout    1800;
          proxy_connect_timeout 1800;

        if ($request_uri ~* ".(ico|css|js|gif|jpe?g|png|json)$") {
                                        expires 30d;
                                        access_log off;
                                        add_header Pragma public;
                                        add_header Cache-Control "public";
                                        break;
}
        }

Thanks

Answer 1

HTTP/1.1

For regular HTTP/1.1 requests, this one should do the trick:

server {
        listen 443 ssl;

        server_name example.com;
        ssl_certificate /etc/ssl/certs/ssl-cert-snakeoil.pem;
        ssl_certificate_key /etc/ssl/private/ssl-cert-snakeoil.key;

        location / {
            proxy_pass http://127.0.0.1:80;
            proxy_set_header X-Real-IP  $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto https;
            proxy_set_header X-Forwarded-Port 443;
            proxy_set_header Host $host;
        }
}

Please make sure you include the right certificates, and proxy through to the right hostname/port.

HTTP/2

For HTTP/2 requests, you can use the following Nginx config:

server {
        listen 443 ssl http2;

        server_name example.com;
        ssl_certificate /etc/ssl/certs/ssl-cert-snakeoil.pem;
        ssl_certificate_key /etc/ssl/private/ssl-cert-snakeoil.key;

        location / {
            proxy_pass http://127.0.0.1:80;
            proxy_set_header X-Real-IP  $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto https;
            proxy_set_header X-Forwarded-Port 443;
            proxy_set_header Host $host;
        }
}

And for Varnish, you need to make sure the -p feature=+http2 runtime flag is added to the varnishd process. So the varnishd process could look like this:

varnishd -a:80 -f /etc/varnish/default.vcl -s malloc,2g -p feature=+http2