Skip to content

Instantly share code, notes, and snippets.

@alexamies

alexamies/README.md

Last active February 2, 2021 10:35
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save alexamies/71f17f878a1efb764e631920ac3b7076 to your computer and use it in GitHub Desktop.
Save alexamies/71f17f878a1efb764e631920ac3b7076 to your computer and use it in GitHub Desktop.
Download ZIP
Using NGINX with Brotli
Raw
README.md

Using NGINX with Brotli

This Gist demonstrates enabling Brotli in Nginx in App Engine Flex using a custom container.

Running in Docker locally

Use of basic Nginx image adapting the example nginx.conf adapted from Full Example Configuration

docker run --rm -itd --name test-nginx \
  -v $(pwd):/usr/share/nginx/html:ro \
  -v $(pwd)/nginx.conf:/etc/nginx/nginx.conf:ro \
  -d -p 8080:80 \
  nginx

Test gzip with Curl:

curl -H "Accept-Encoding: gzip" -I http://localhost:8080/test.json

You should see a response that includes the header

Content-Encoding: gzip

Stop the server

docker stop test-nginx

Get the Brotli plug-n

git clone https://github.com/fholzer/docker-nginx-brotli.git
cd docker-nginx-brotli
docker build -t nginx-brotli .
cd ..
docker run --rm -itd --name test-nginx -v $(pwd):/usr/share/nginx/html:ro -d -p 8080:80 nginx-brotli

Test Brotli with Curl:

curl -H "Accept-Encoding: br" -I http://localhost:8080/test.html

You should see a line like

Content-Encoding: br

For this to work with json responses, edit the file docker-nginx-brotli/nginx.conf adding the line

brotli_types    text/html application/json;

Build and run again then test Brotli with for a json file:

curl -H "Accept-Encoding: br" -I http://localhost:8080/test.json

App Engine Flex

The instructions here are adapted from the Quickstart for Custom Runtimes in the App Engine Flexible Environment

Copy the test files to be served to docker-nginx-brotli directory

cp test.html docker-nginx-brotli/.
cp test.json docker-nginx-brotli/.

Edit the docker-nginx-brotli/Dockerfile so that the test files are embedded directly in the Docker image, adding these lines:

RUN mkdir -p /usr/share/nginx/www/
RUN mkdir -p /var/log/app_engine/
COPY test.html /usr/share/nginx/www/index.html
COPY *.json /usr/share/nginx/www/

Edit nginx.conf, adding these lines

access_log /var/log/app_engine/app.log;
error_log /var/log/app_engine/app.log;
server {
        listen 8080;
        root /usr/share/nginx/www;
        index index.html index.htm;
    }

Build again locally and upload to Google Container Registry

PROJECT_ID={Your project}
TAG=t1
gcloud config set project $PROJECT_ID
docker tag nginx-brotli gcr.io/$PROJECT_ID/nginx-brotli:$TAG
docker push gcr.io/$PROJECT_ID/nginx-brotli:$TAG

Then deploy to a App Engine using the gcloud app deploy command:

cp custom-app.yaml docker-nginx-brotli/app.yaml
cd docker-nginx-brotli
gcloud app deploy --image-url=gcr.io/$PROJECT_ID/nginx-brotli:$TAG

Verify the result

curl -H "Accept-Encoding: br" -I https://$PROJECT_ID.appspot.com/index.html
curl -H "Accept-Encoding: br" -I https://$PROJECT_ID.appspot.com/test.json
Raw
nginx.conf
user nginx;
worker_processes 1;
error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
#tcp_nopush on;
keepalive_timeout 65;
gzip on;
gzip_types text/html application/json;
include /etc/nginx/conf.d/*.conf;
}
Raw
test.html
<html>
<hread>
<title>Test HTML File</title>
</head>
<body>
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight"
</body>
</html>
Raw
test.json
{"numbers":["one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight",
"one","two","three","three","four","five","six","seven","eight"]}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment