Install and Configure Google PageSpeed and NGINX on Ubuntu

1 Star2 Stars3 Stars4 Stars5 Stars (3 votes, avr: 5.00)

Pagespeed Module It was originally a Google Project which is now part of Apache Incubator. Pagespeed can automatically improves web page latency by changing the resources on that web page to implement web performance best practices. Learn how to install and configure Google PageSpeed on NGINX

This guide will show how to compile both NGINX and PageSpeed. If you would prefer to use PageSpeed as a module for NGINX.

Prerequisites

Before starting with this guide, it’s better you need to have domains or subdomain name pointing to your public server IP. on the following tutorial we will use lab.axfon.com. If you do not have public IP or domain you may also follow this tutorial using local server.


Step 1: Install NGINX as Web Server

Now we are going to install NGINX stable version by default repository Ubuntu, to do this type the command below:

sudo apt update && sudo apt install nginx

Once NGINX already installed, to check and verify Nginx service status type the command below

sudo service nginx status

If it is running and working properly you will see the output NGINX active (running) like below

● nginx.service - A high performance web server and a reverse proxy server
   Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
   Active: active (running) since Thu 2019-01-03 21:00:12 UTC; 5h 3min ago
     Docs: man:nginx(8)
  Process: 3083 ExecStart=/usr/sbin/nginx -g daemon on; master_process on; (code=exited, stat
  Process: 3068 ExecStartPre=/usr/sbin/nginx -t -q -g daemon on; master_process on; (code=exi
 Main PID: 3087 (nginx)
    Tasks: 2 (limit: 665)
   Memory: 4.4M
   CGroup: /system.slice/nginx.service
           ├─3087 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
           └─3088 nginx: worker process
Jan 03 21:00:12 axfon-lab systemd[1]: Starting A high performance web server and a reverse pr
Jan 03 21:00:12 axfon-lab systemd[1]: nginx.service: Failed to parse PID from file /run/nginx
Jan 03 21:00:12 axfon-lab systemd[1]: Started A high performance web server and a reverse pro

To exit Nginx service status just press q on the keyboard


Step 2: Configuration the Firewall with UFW

UFW (Uncomplicated Firewall) is an Iptable interface to easily configure a firewall on your system. If it does not yet enable, it’s recommended to enable and setup the rule for Nginx

For the first, we have to add rule for SSH, let’s se the command line below

sudo ufw allow OpenSSH

Add the rule receive HTTP to Nginx

sudo ufw allow 'Nginx HTTP'

Then you will see on terminal

Rule added
Rule added (v6)'

Now enable ufw for Firewall.

sudo ufw enable

If prompted just pres Y to accept and continue and to check UFW status type the command below

sudo ufw status

You will see the output UFW active (running) like below

Status: active
To                         Action      From
--                         ------      ----
OpenSSH                    ALLOW       Anywhere
Nginx HTTP                 ALLOW       Anywhere
OpenSSH (v6)               ALLOW       Anywhere (v6)
Nginx HTTP (v6)            ALLOW       Anywhere (v6)

NGINX web server now is ready on Ubuntu, now you may go to your web browser and visit your domain or IP. If you have not configured domain name yet and don’t know your IP, use the following command find out

sudo ifconfig | grep -Eo 'inet (addr:)?([0-9]*\.){3}[0-9]*' | grep -Eo '([0-9]*\.){3}[0-9]*' | grep -v '127.0.0.1'

If everything is OK you will be presented on your browser with the default NGINX landing page as below


Step 3: Install Google Pagepeed and Modules

To automatically install dependencies and build the latest mainline version of NGINX with the latest stable version of ngx_pagespeed, it will update/upgrade NGINX installed before. to do this run the command below

sudo apt install libssl-dev
bash <(curl -f -L -sS https://ngxpagespeed.com/install) \
--nginx-version latest

While the installation process add the modules below

Extracting nginx…About to build nginx. Do you have any additional ./configure arguments you would like to set? For example, if you would liketo build nginx with https support give –with-http_ssl_moduleIf you don’t have any, just press enter.

--prefix=/etc/nginx --sbin-path=/usr/sbin/nginx --modules-path=/usr/lib/nginx/modules --conf-path=/etc/nginx/nginx.conf --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --pid-path=/var/run/nginx.pid --lock-path=/var/run/nginx.lock --http-client-body-temp-path=/var/cache/nginx/client_temp --http-proxy-temp-path=/var/cache/nginx/proxy_temp --http-fastcgi-temp-path=/var/cache/nginx/fastcgi_temp --http-uwsgi-temp-path=/var/cache/nginx/uwsgi_temp --http-scgi-temp-path=/var/cache/nginx/scgi_temp --user=nginx --group=nginx --with-http_ssl_module --with-http_v2_module

Next you’ll be asked if you want to build NGINX and configuration files and binaries.If these look correct, answer Y to continue.


Step 4: Configure Systemd for NGINX Control

NGINX can be controlled by a systemd service or by binary directly. Choose one of these methods and do not mix them. If you start NGINX using the binary commands, systemd will not be aware of the process and will try to start another NGINX instance if you run systemctl start nginx, which will fail.

Default systemd location is in the directory /lib/systemd/system/nginx.service and use the following command to edit

sudo nano /lib/systemd/system/nginx.service

Replace it with below

[Unit]
Description=The NGINX HTTP and reverse proxy server
After=syslog.target network.target remote-fs.target nss-lookup.target

[Service]
Type=forking
PIDFile=/run/nginx.pid
ExecStartPre=/usr/sbin/nginx -t
ExecStart=/usr/sbin/nginx
ExecReload=/bin/kill -s HUP $MAINPID
ExecStop=/bin/kill -s QUIT $MAINPID
PrivateTmp=true

[Install]
WantedBy=multi-user.target

Press Ctrl/Cmd + X and then press Y and ENTER to save changes


Step 5: Create Chache Directory and Grant Permission

Create PageSpeed’s cache location and change its ownership to the nginx user and group

useradd --no-create-home nginx
mkdir -p /var/cache/nginx/client_temp
mkdir /var/cache/ngx_pagespeed/
chown nginx:nginx /var/cache/ngx_pagespeed/

Set permission ownership for the current user to be able to modify any files in these directories. The variable$(whoami) will take the value of the user you are currently logged in.

sudo chown -R $(whoami):$(whoami) /var/www/html/

Grant Directory Permission

sudo chmod -R 755 /var/www
Note:

If you couldn’t create a directory with error message useradd: Permission denied please log in with to root access by using the command sudo -s and enter with your password


Step 6: Configure Server Blocks and Enable PageSpeed

Nginx Server Blocks allows to run or host one or multi-domain on a single server. To configure Server Block you have to specify document root for each domain and you can create a sperately configuration for Security, SSL, Cache and more. Nginx contains a default server block in /etc/nginx/sites-available/default

Then edit these files using nano editor:

sudo nano /etc/nginx/sites-available/default

You will be presented as following, on the code with the red line root is directory location that already created before and server_name is a server IP or domain name (change it with your own) and enable PageSpeed pagespeed on;

server {
        listen 80 default_server;
        listen [::]:80 default_server;

        # include snippets/snakeoil.conf;
        root /var/www/html;
        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name lab.axfon.com www.lab.axfon;
        
        access_log   logs/lab-axfon.access.log;
        error_log    logs/lab-axfon.error error;

        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ =404;
        }
        
        pagespeed on;
        pagespeed FileCachePath "/var/cache/ngx_pagespeed/";
        pagespeed RewriteLevel OptimizeForBandwidth;

        location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
           add_header "" "";
        }

        location ~ "^/pagespeed_static/" { }
        location ~ "^/ngx_pagespeed_beacon$" { }

}

Press Ctrl/Cmd + X and then press Y and ENTER to save changes


Step 7: Create Testing File

Now we will create a file into the default root directory

sudo echo "Thanks Axfon.com for Google PageSpeed Configuration" > /var/www/html/index.html

Step 8: Troubleshooting and Restart NGINX

Changes made in the NGINX configuration file will not be applied until the command to Restart and Before testing on the Browser we have to verify and make sure no error.

sudo nginx -t

If there is no error you will see as the follow

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

If on-screen or terminal console presented error code like below

nginx: [emerg] dlopen() "/etc/nginx/modules/ngx_http_geoip_module.so" failed (/etc/nginx/modu
les/ngx_http_geoip_module.so: cannot open shared object file: No such file or directory) in /
etc/nginx/modules-enabled/50-mod-http-geoip.conf:1

We have to disable include /etc/nginx/modules-enabled/*.conf; by typing the hashtag # in a file /etc/nginx/nginx.conf (we will explain on separate tutorial how to enable GeoIP module for Google PageSpeed).

sudo nano /etc/nginx/nginx.conf
user www-data;
worker_processes auto;
pid /run/nginx.pid;
#include /etc/nginx/modules-enabled/*.conf;
events {
        worker_connections 768;
        # multi_accept on;
}

Press Ctrl/Cmd + X and then press Y and ENTER to save changes

If you find warning error like below

Warning: The unit file, source configuration file or drop-ins of nginx.service changed on dis
k. Run 'systemctl daemon-reload' to reload units.

It means we configured nginx.service on systemd before just running systemctl daemon-reload

sudo systemctl daemon-reload

Then Restart NGINX

sudo service nginx restart

Step 9: Test PageSpeed is Running

To test PageSpeed is running on NGINX is successfully serving pages use the command below

curl -I -X GET lab.axfon.com

You may change above with your domain or IP and let’s see below you will find X-Page-Speed:(version)  it means PageSpeed is running on

HTTP/1.1 200 OK
Server: nginx/1.15.8
Content-Type: text/html
Transfer-Encoding: chunked
Connection: keep-alive
ETag: "5c315990-34"
Date: Sun, 06 Jan 2019 01:40:46 GMT
X-Page-Speed: 1.13.35.2-0
Cache-Control: max-age=0, no-cache

Step 10: Testing Page on the Browser

You can now view this page in your web browser by visiting your server’s domain name or public IP address http://your_domain_or_IP/ let’s see on the browser add on detected Cache Tool and Web Server Extension Google PageSpeed working correctly.. Congraaaats…


If this tutorial could help you, please rate above Star button rating and share to help others find it! Feel free to leave a comment below.

Recommended For You

Axfon

About the Author: Axfon

Team committed to share our IT skills and experience through our website which may assist to formulate a task easy