Table of Contents
 New Static WebSite Demo.
Home Operation and Maintenance Nginx Serving static content using nginx

Serving static content using nginx

Nov 30, 2019 pm 02:37 PM
nginx

Serving static content using nginx

An important web server task is serving files (such as images or static HTML pages).

Depending on the request, files will be served from different local directories: /data/www (which may contain HTML files) and /data/images (which may contain images). This will require editing the configuration file and setting up the server block inside the http block using two location blocks. (Recommended learning: nginx use)

First, create the /data/www directory and put an index.html file containing any text content into it, and create / data/images directory and put some images in it. Create two directories-

[root@localhost ~]# mkdir -p /data/www
[root@localhost ~]# mkdir -p /data/images
[root@localhost ~]#
Copy after login

Put two files in the two directories created above: /data/www/index.html and /data/images/logo.png, /data The content of the /www/index.html file is one line, as follows -

<h2 id="nbsp-New-nbsp-Static-nbsp-WebSite-nbsp-Demo"> New Static WebSite Demo.</h2>
Copy after login

Next, open the configuration file (/usr/local/nginx/conf/nginx.conf). The default configuration file already contains several examples of server blocks, most of which are commented out. Now comment out all such blocks and start a new server block:

http {
    server {
    }
}
Copy after login

Typically, the configuration file can include several server blocks distinguished by the port the server listens on and the server name. When nginx decides which server to handle the request, it tests the URI specified in the request header against the parameters of the location directive defined inside the server block.

Add the following location block to the server block:

http {
    server {
        location / {
            root /data/www;
        }
    }
}
Copy after login
The location block specifies the "/" prefix that is compared to the URI in the request . For matching requests, the URI will be added to the path specified in the root directive (i.e. /data/www) to form the path to the requested file on the local file system. If there are several matching location blocks, nginx will choose the one with the longest prefix to match the location block. The location block above provides the shortest prefix length of 1, so this block will only be used if all other location blocks cannot provide a match.

Next, add a second location block:

http {
    server {
        location / {
            root /data/www;
        }
        location /images/ {
            root /data;
        }
    }
}
Copy after login
It will also match requests starting with /images/(location/, but with a shorter prefix , that is, "/images/" is longer than "/") to match the request.

The final configuration of the server block should look like this:

server {
    location / {
        root /data/www;
    }
    location /images/ {
        root /data;
    }
}
Copy after login

This is already a server listening on the standard port 80 and accessible on the local machine ( http://localhost/ ) working configuration. In response to a request for a URI starting with /images/, the server will send files from the /data/images directory. For example, in response to a http://localhost/images/logo.png request, nginx will send the /data/images/logo.png file on the service. If the file does not exist, nginx will send a response indicating a 404 error. Requests for URIs not starting with /images/ will be mapped to the /data/www directory. For example, in response to a request for http://localhost/about/example.html, nginx will send the /data/www/about/example.html file.

To apply the new configuration, start nginx if it has not been done yet or send a reload signal to nginx's main process by executing the following command:

[root@localhost ~]# /usr/local/nginx/sbin/nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful
[root@localhost ~]# /usr/local/nginx/sbin/nginx -s reload
Copy after login
If an error or exception prevents the If it works normally, you can try to check the access.log and error.log files in the directory /usr/local/nginx/logs or /var/log/nginx to find the reason.

Open a browser or use CURL to access the Nginx server as shown below-

Serving static content using nginx

The complete nginx.conf file configuration content is as follows:

#user  nobody;
worker_processes  1;
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;
#pid        logs/nginx.pid;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    #log_format  main  &#39;$remote_addr - $remote_user [$time_local] "$request" &#39;
    # &#39;$status $body_bytes_sent "$http_referer" &#39;
    # &#39;"$http_user_agent" "$http_x_forwarded_for"&#39;;
    #access_log  logs/access.log  main;
    sendfile        on;
    #tcp_nopush     on;
    #keepalive_timeout  0;
    keepalive_timeout  65;
    #gzip  on;
    ## 新服务(静态网站)
    server {
        location / {
            root /data/www;
        }
        location /images/ {
            root /data;
        }
    }
}
Copy after login

The above is the detailed content of Serving static content using nginx. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to configure cloud server domain name in nginx How to configure cloud server domain name in nginx Apr 14, 2025 pm 12:18 PM

How to configure an Nginx domain name on a cloud server: Create an A record pointing to the public IP address of the cloud server. Add virtual host blocks in the Nginx configuration file, specifying the listening port, domain name, and website root directory. Restart Nginx to apply the changes. Access the domain name test configuration. Other notes: Install the SSL certificate to enable HTTPS, ensure that the firewall allows port 80 traffic, and wait for DNS resolution to take effect.

How to check nginx version How to check nginx version Apr 14, 2025 am 11:57 AM

The methods that can query the Nginx version are: use the nginx -v command; view the version directive in the nginx.conf file; open the Nginx error page and view the page title.

How to start nginx server How to start nginx server Apr 14, 2025 pm 12:27 PM

Starting an Nginx server requires different steps according to different operating systems: Linux/Unix system: Install the Nginx package (for example, using apt-get or yum). Use systemctl to start an Nginx service (for example, sudo systemctl start nginx). Windows system: Download and install Windows binary files. Start Nginx using the nginx.exe executable (for example, nginx.exe -c conf\nginx.conf). No matter which operating system you use, you can access the server IP

How to check the name of the docker container How to check the name of the docker container Apr 15, 2025 pm 12:21 PM

You can query the Docker container name by following the steps: List all containers (docker ps). Filter the container list (using the grep command). Gets the container name (located in the "NAMES" column).

How to check whether nginx is started How to check whether nginx is started Apr 14, 2025 pm 01:03 PM

How to confirm whether Nginx is started: 1. Use the command line: systemctl status nginx (Linux/Unix), netstat -ano | findstr 80 (Windows); 2. Check whether port 80 is open; 3. Check the Nginx startup message in the system log; 4. Use third-party tools, such as Nagios, Zabbix, and Icinga.

How to run nginx apache How to run nginx apache Apr 14, 2025 pm 12:33 PM

To get Nginx to run Apache, you need to: 1. Install Nginx and Apache; 2. Configure the Nginx agent; 3. Start Nginx and Apache; 4. Test the configuration to ensure that you can see Apache content after accessing the domain name. In addition, you need to pay attention to other matters such as port number matching, virtual host configuration, and SSL/TLS settings.

How to create a mirror in docker How to create a mirror in docker Apr 15, 2025 am 11:27 AM

Steps to create a Docker image: Write a Dockerfile that contains the build instructions. Build the image in the terminal, using the docker build command. Tag the image and assign names and tags using the docker tag command.

How to start containers by docker How to start containers by docker Apr 15, 2025 pm 12:27 PM

Docker container startup steps: Pull the container image: Run "docker pull [mirror name]". Create a container: Use "docker create [options] [mirror name] [commands and parameters]". Start the container: Execute "docker start [Container name or ID]". Check container status: Verify that the container is running with "docker ps".

See all articles