Jses.ioby Shaojiang

Configure Nginx to support HTTP/3 and Quic

Shaojiang

Date:

Configure Nginx to support HTTP/3 and Quic

1. Introduction

It's time to embrace the era of HTTP/3. As of 23 May, 2023, Nginx v1.25.0 starts to experimentally support HTTP/3. This article will not shed much light on the concepts of HTTP/3 and Quic, but will focus on how to configure Nginx to support HTTP/3 for a web application.

For more conceptual discussion on Quic and HTTP/3, please refer to the excellent articles below:

  1. HTTP/3 From A To Z: Core Concepts

  2. HTTP/3: Performance Improvements (Part 2)

  3. HTTP/3: Practical Deployment Options (Part 3)

  4. HTTP/3: Has your company adopted it yet?

2. Prerequisites

Before reading this article, we assume that you have knowledge about web development, including:

  1. Nginx: a web server software to deploy highly responsive websites

  2. HTTPS: an extension of the Hypertext Transfer Protocol (HTTP). It uses encryption for secure communication over a computer network. It's required by HTTP/3. In order to support that, you will need to apply for a SSL certificate. For details you can refer to A complete guide to make your first website online with HTTPS - Config HTTPS

  3. Web hosting: you should have a web server with a public IP to put the website source code, install Nginx, and serving the website. Here we use Linode. The operating system is Ubuntu 22.04.3 LTS.

3. Install Nginx 1.25

Nginx starts to support HTTP/3 from version 1.25, which is still a Mainline version:

NGINX Open Source is available in two versions:

Mainline – Includes the latest features and bug fixes and is always up to date. It is reliable, but it may include some experimental modules, and it may also have some number of new bugs. Stable – Doesn’t include all of the latest features, but has critical bug fixes that are always backported to the mainline version. We recommend the stable version for production servers.

We are using Ubuntu, so follow the Nginx official documentation to install Nginx 1.25: Installing NGINX Open Source - Installing Prebuilt Ubuntu Packages. Simply follow the 8 stpes one by one and run them, it should go to the end smoothly.

On step 4, remember to add the mainline source URL http://nginx.org/packages/mainline/ubuntu:

1echo "deb [signed-by=/usr/share/keyrings/nginx-archive-keyring.gpg] \
2http://nginx.org/packages/mainline/ubuntu `lsb_release -cs` nginx" \
3    | sudo tee /etc/apt/sources.list.d/nginx.list
4

Make sure you can see the desired version by running the command line nginx -v.

4. Nginx configuration file

For nginx 1.25, the configuration files are at /etc/nginx/conf.d. Upon a fresh installation, there is a default .conf file in the folder, simply replace it with the content below:

1root@localhost:~# cat /etc/nginx/conf.d/jscoder.io.conf 
2server {
3    listen 80; # default_server;
4    listen [::]:80; # default_server;
5
6    location / {
7        return 301 https://$host$request_uri;
8    }
9}
10server {
11    listen 443 quic reuseport;
12    listen 443 ssl;
13    server_name jscoder.io;
14    ssl_certificate /root/jscoder_io.crt;
15    ssl_certificate_key /root/jscoder-ssl.key;
16    ssl_protocols TLSv1.2 TLSv1.3;
17    quic_retry on;
18    ssl_early_data on;
19
20    location / {
21        add_header Alt-Svc 'h3=":$server_port"; ma=86400';
22        add_header X-protocol $server_protocol always;
23        add_header Strict-Transport-Security max-age=15768000;
24        root   /usr/share/nginx/html;
25        index  index.html index.htm;
26    }
27}

A complete list of HTTP/3 configuration parameters can be found at HTTP3 with NGINX. Please do take in mind that:

  1. Make sure your server has made port 443 open

  2. Make sure you have prepared the SSL certificates (for directives ssl_certificate /root/jscoder_io.crt; and ssl_certificate_key /root/jscoder-ssl.key;)

  3. Everytime we change the conf file, we need to restart or reload the nginx server. Run service nginx restart to make the changes take effect.

5. Verification

Once everything above is ready, restart nginx and visit your site at https://http3check.net/?host=https%3A%2F%2Fjscoder.io%2F. You should be able to see a green checkmark:

Alternatively, inspect the page and check the Network tab, show the Protocol field, you should be able to see the value as H3 (HTTP/3).

Table of Contents