search
HomeOperation and MaintenanceNginxServing 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 ~]#

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>

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 {
    }
}

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;
        }
    }
}
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;
        }
    }
}
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;
    }
}

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
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;
        }
    }
}

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
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
NGINX Unit's Advantages: Flexibility and PerformanceNGINX Unit's Advantages: Flexibility and PerformanceApr 20, 2025 am 12:07 AM

NGINXUnit improves application flexibility and performance with its dynamic configuration and high-performance architecture. 1. Dynamic configuration allows the application configuration to be adjusted without restarting the server. 2. High performance is reflected in event-driven and non-blocking architectures and multi-process models, and can efficiently handle concurrent connections and utilize multi-core CPUs.

NGINX vs. Apache: Performance, Scalability, and EfficiencyNGINX vs. Apache: Performance, Scalability, and EfficiencyApr 19, 2025 am 12:05 AM

NGINX and Apache are both powerful web servers, each with unique advantages and disadvantages in terms of performance, scalability and efficiency. 1) NGINX performs well when handling static content and reverse proxying, suitable for high concurrency scenarios. 2) Apache performs better when processing dynamic content and is suitable for projects that require rich module support. The selection of a server should be decided based on project requirements and scenarios.

The Ultimate Showdown: NGINX vs. ApacheThe Ultimate Showdown: NGINX vs. ApacheApr 18, 2025 am 12:02 AM

NGINX is suitable for handling high concurrent requests, while Apache is suitable for scenarios where complex configurations and functional extensions are required. 1.NGINX adopts an event-driven, non-blocking architecture, and is suitable for high concurrency environments. 2. Apache adopts process or thread model to provide a rich module ecosystem that is suitable for complex configuration needs.

NGINX in Action: Examples and Real-World ApplicationsNGINX in Action: Examples and Real-World ApplicationsApr 17, 2025 am 12:18 AM

NGINX can be used to improve website performance, security, and scalability. 1) As a reverse proxy and load balancer, NGINX can optimize back-end services and share traffic. 2) Through event-driven and asynchronous architecture, NGINX efficiently handles high concurrent connections. 3) Configuration files allow flexible definition of rules, such as static file service and load balancing. 4) Optimization suggestions include enabling Gzip compression, using cache and tuning the worker process.

NGINX Unit: Supporting Different Programming LanguagesNGINX Unit: Supporting Different Programming LanguagesApr 16, 2025 am 12:15 AM

NGINXUnit supports multiple programming languages ​​and is implemented through modular design. 1. Loading language module: Load the corresponding module according to the configuration file. 2. Application startup: Execute application code when the calling language runs. 3. Request processing: forward the request to the application instance. 4. Response return: Return the processed response to the client.

Choosing Between NGINX and Apache: The Right Fit for Your NeedsChoosing Between NGINX and Apache: The Right Fit for Your NeedsApr 15, 2025 am 12:04 AM

NGINX and Apache have their own advantages and disadvantages and are suitable for different scenarios. 1.NGINX is suitable for high concurrency and low resource consumption scenarios. 2. Apache is suitable for scenarios where complex configurations and rich modules are required. By comparing their core features, performance differences, and best practices, you can help you choose the server software that best suits your needs.

How to start nginxHow to start nginxApr 14, 2025 pm 01:06 PM

Question: How to start Nginx? Answer: Install Nginx Startup Nginx Verification Nginx Is Nginx Started Explore other startup options Automatically start Nginx

How to check whether nginx is startedHow to check whether nginx is startedApr 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.

See all articles

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

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

PhpStorm Mac version

PhpStorm Mac version

The latest (2018.2.1) professional PHP integrated development tool

VSCode Windows 64-bit Download

VSCode Windows 64-bit Download

A free and powerful IDE editor launched by Microsoft