How to Serve Static HTML Files In Nginx?

10 minutes read

To serve static HTML files in Nginx, you can follow these steps:

  1. Prepare your HTML files: Make sure you have the static HTML files that you want to serve. These files should be placed in a designated directory on your server.
  2. Install Nginx: Verify that Nginx is installed on your server. If not, you can install it using the package manager specific to your operating system.
  3. Configure Nginx: Locate the main Nginx configuration file, typically named nginx.conf, which is usually located in the /etc/nginx/ directory. Open this file using a text editor of your choice.
  4. Update the server block: Inside the http block, locate the server block that corresponds to your website or domain. If no specific server block exists, you can create one. Typically, this can be found within the server{} block.
  5. Configure the server block: Add the following lines of code in the server block:
1
2
3
4
5
6
7
8
9
server {
    listen      80;  # Replace with your desired port
    server_name your_domain.com;  # Replace with your domain or leave it as _
    root        /path/to/your/html/files;  # Replace with the path to your HTML files

    location / {
        try_files $uri $uri/ =404;
    }
}


Make sure to replace 80 with the desired port number, your_domain.com with your actual domain name, and /path/to/your/html/files with the actual path to your HTML files.

  1. Save the configuration file: Once you have made the necessary changes, save the nginx.conf file and exit the text editor.
  2. Restart Nginx: Restart the Nginx service to apply the changes. You can do this by running the following command in the terminal:
1
sudo service nginx restart


or

1
sudo systemctl restart nginx


  1. Test the setup: Open a web browser and enter the URL http://your_domain.com, replacing your_domain.com with your actual domain. If everything is configured correctly, Nginx will serve the static HTML files from the specified directory.


That's it! You have successfully set up Nginx to serve static HTML files.

Best Nginx Books to Ready in 2024

1
Nginx HTTP Server - Third Edition: Harness the power of Nginx to make the most of your infrastructure and serve pages faster than ever

Rating is 5 out of 5

Nginx HTTP Server - Third Edition: Harness the power of Nginx to make the most of your infrastructure and serve pages faster than ever

2
Mastering NGINX Second Edition

Rating is 4.9 out of 5

Mastering NGINX Second Edition

3
NGINX Cookbook: Over 70 recipes for real-world configuration, deployment, and performance

Rating is 4.8 out of 5

NGINX Cookbook: Over 70 recipes for real-world configuration, deployment, and performance

4
Nginx HTTP Server: Harness the power of Nginx to make the most of your infrastructure and serve pages faster than ever before, 4th Edition

Rating is 4.7 out of 5

Nginx HTTP Server: Harness the power of Nginx to make the most of your infrastructure and serve pages faster than ever before, 4th Edition

5
NGINX Cookbook: Advanced Recipes for High-Performance Load Balancing

Rating is 4.6 out of 5

NGINX Cookbook: Advanced Recipes for High-Performance Load Balancing

6
Nginx Simplified: Practical Guide to Web Server Configuration and Optimization

Rating is 4.5 out of 5

Nginx Simplified: Practical Guide to Web Server Configuration and Optimization


How to install Nginx on Ubuntu?

To install Nginx on Ubuntu, follow these steps:

  1. Update the system packages by running the command: sudo apt update
  2. Install Nginx by running the command: sudo apt install nginx
  3. After the installation is complete, start the Nginx service by running the command: sudo systemctl start nginx You can also enable Nginx to start on boot by running: sudo systemctl enable nginx
  4. To verify that Nginx is running correctly, open a web browser and enter your server's IP address. You should see the default Nginx welcome page.


By default, Nginx configurations are stored in the /etc/nginx directory. You can edit the configuration files using a text editor such as nano or vim.


Note: If you have a firewall enabled, you may need to allow HTTP traffic on port 80 for Nginx to work properly.


How to set up SSL/TLS for serving static HTML files in Nginx?

To set up SSL/TLS for serving static HTML files in Nginx, you can follow these steps:

  1. Install Nginx on your server if you haven't already. You can do this by running the following command: sudo apt-get install nginx
  2. Generate a self-signed SSL certificate or obtain a valid SSL certificate from a trusted certificate authority. For simplicity, we'll generate a self-signed certificate here. Run the following command to generate a self-signed certificate: sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout /etc/nginx/ssl/private.key -out /etc/nginx/ssl/certificate.crt
  3. Configure Nginx to use the SSL certificate. Open the Nginx configuration file in a text editor: sudo nano /etc/nginx/sites-available/default
  4. Inside the server block, add the following lines to enable SSL: listen 443 ssl; ssl_certificate /etc/nginx/ssl/certificate.crt; ssl_certificate_key /etc/nginx/ssl/private.key;
  5. Comment out or remove any existing listen directives for port 80.
  6. Configure the server to serve your static HTML files. Inside the server block, add or modify the following lines: root /path/to/your/html/files; index index.html;
  7. Save the changes and exit the text editor.
  8. Restart Nginx for the changes to take effect: sudo service nginx restart


Now, Nginx is set up to serve static HTML files over HTTPS using SSL/TLS. Access the files by visiting https://your_domain.com.


How to limit access to specific IP addresses in Nginx?

To limit access to specific IP addresses in Nginx, you can use the "allow" and "deny" directives. Here's how you can do it:

  1. Open your Nginx configuration file. The configuration file is usually located at /etc/nginx/nginx.conf or /etc/nginx/conf.d/default.conf.
  2. Within the http block, add the following code to limit access to specific IP addresses:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
http {
    ...
    # Limit access to specific IP addresses
    location / {
        deny all;
        allow 192.168.1.1;
        allow 10.0.0.0/24;
        allow 2001:0db8::/32;
        allow ::1;
        deny all;
    }
    ...
}


In this example, IP addresses 192.168.1.1, 10.0.0.0/24, and 2001:0db8::/32 are allowed, while ::1 (localhost) is also allowed. All other IP addresses are denied access.

  1. Save the configuration file and exit.
  2. Test the configuration to make sure there are no syntax errors. Run the following command:
1
sudo nginx -t


If any errors are detected, fix them before proceeding.

  1. If the test is successful, reload the Nginx configuration to apply the changes:
1
sudo systemctl reload nginx


Now, Nginx will only allow access to the specific IP addresses you specified, denying all other IP addresses.


How to redirect requests to a specific HTML file in Nginx?

To redirect requests to a specific HTML file in Nginx, you can use the location block and the return directive. Here's an example configuration:

  1. Open your Nginx configuration file using a text editor. The default location of the configuration file is usually /etc/nginx/nginx.conf.
  2. Inside the http block, add a new server block:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
http {
  ...

  server {
    listen 80;
    server_name example.com;

    location / {
      try_files $uri $uri/ /index.html;
    }

    location /old-page {
      return 301 /new-page.html;
    }
  }

  ...
}


In this example, assume that you want to redirect requests from /old-page to /new-page.html.

  1. Save the configuration file and exit the text editor.
  2. Restart or reload Nginx for the changes to take effect. The command to restart Nginx may vary depending on your operating system. For example:
1
sudo service nginx restart


Now, when a client makes a request to /old-page, Nginx will respond with a 301 redirect status code and redirect the client to /new-page.html.


How to configure HTTP/2 in Nginx?

To configure HTTP/2 in Nginx, follow these steps:

  1. Update Nginx: Ensure that you are using a version of Nginx that supports HTTP/2. Nginx 1.9.5 or later versions are recommended.
  2. SSL/TLS Configuration: HTTP/2 requires encryption, so you need to configure SSL/TLS on your Nginx server. Generate or obtain an SSL/TLS certificate and private key.
  3. Edit Nginx Configuration: Open the Nginx configuration file (usually located at /etc/nginx/nginx.conf or /etc/nginx/conf.d/default.conf) using a text editor.
  4. Enable HTTP/2: To enable HTTP/2, add the http2 parameter to the listen directive in your server block. For example:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
server {
    listen 443 ssl http2;
    server_name example.com;

    # SSL/TLS configuration
    ssl_certificate /path/to/certificate.crt;
    ssl_certificate_key /path/to/private.key;

    # rest of the server configuration
    ...
}


Make sure to update the paths to the SSL/TLS certificate and private key files.

  1. Save and close the configuration file.
  2. Test Configuration: Run the following command to check if the configuration is correct:
1
nginx -t


This command will check the syntax of the Nginx configuration and report any errors.

  1. Restart Nginx: If the configuration test is successful, restart Nginx to apply the changes:
1
systemctl restart nginx


or

1
service nginx restart


That's it! Nginx should now be configured to use HTTP/2. You can verify if HTTP/2 is enabled by visiting your website and checking the network tab in the browser's developer tools. Look for the HTTP/2 protocol in the response headers.

Facebook Twitter LinkedIn Telegram Whatsapp Pocket

Related Posts:

To use NGINX to host a website, follow these steps:Install NGINX: Begin by installing NGINX on your server or computer. The installation process may vary depending on your operating system. NGINX has official documentation to guide you through the installation...
To serve multiple sitemap.xml files in nginx, you can follow these steps:Open your NGINX configuration file for editing. This file is typically located at /etc/nginx/nginx.conf or /etc/nginx/conf.d/default.conf. Locate the server directive block where you want...
To enable Brotli compression in NGINX, you can follow these steps:Start by installing the necessary tools. Ensure that you have the NGINX web server installed on your system. You also need the Brotli compression library and the ngx_brotli module for NGINX. Onc...
To increase the NGINX timeout, you need to make changes to the NGINX configuration file. Here's how:Locate the NGINX configuration file. It is typically named nginx.conf or nginx.conf.sample and is usually located in the /etc/nginx/ directory. Open the NGI...
To configure Nginx in Ubuntu, you need to perform the following steps:Install Nginx: Begin by installing Nginx using the package manager of Ubuntu. Enter the command sudo apt-get install nginx in the terminal to perform the installation. Start Nginx: After the...
To install Nginx in Arch Linux, you can follow these steps:Update the package manager by running the command: sudo pacman -Syu Install Nginx by executing the command: sudo pacman -S nginx Once the installation is complete, start the Nginx service using: sudo s...