Brotley compressor. Why does the browser always get the uncompressed file?

Question

Nginx

Hello! I am using webpack to compress scripts into brotli format. This is what the files look like in the end:



Nginx configuration:

root /var/www/laravel/public;

server_name mysite.com;

add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";

index index.php;

charset utf-8;

location / {
    try_files $uri $uri/ /index.php?$query_string;
}

location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt  { access_log off; log_not_found off; }

error_page 404 /index.php;

location ~ \.php$ {
    fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
    fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
    include fastcgi_params;
}

location ~ /\.(?!well-known).* {
    deny all;
}

listen 443 ssl;
ssl_certificate /etc/letsencrypt/live/mysite/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/mysite/privkey.pem; # managed by Certbot
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;

brotli on;
brotli_static on;
brotli_types *;

Screenshot from Chrome:



Here are the headers, I think they are correct



But Chrome still gets the uncompressed file! When I simulate "Fast 3G" internet speed, Chrome slowly downloads an uncompressed 1.6 MB file. What am I doing wrong?