搭建静态文件服务器

本节介绍如何使用Nginx搭建静态文件服务器。

基本配置

简单静态文件服务器

server {
    listen 80;
    server_name static.example.com;

    root /var/www/static;
    index index.html;

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

完整静态文件服务器

server {
    listen 80;
    server_name static.example.com;

    root /var/www/static;
    index index.html;

    # 静态资源
    location ~* \.(jpg|jpeg|png|gif|webp|svg|ico)$ {
        expires 30d;
        add_header Cache-Control "public";
    }

    # CSS和JS
    location ~* \.(css|js)$ {
        expires 30d;
        add_header Cache-Control "public";
    }

    # 字体
    location ~* \.(woff|woff2|ttf|otf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 禁止访问隐藏文件
    location ~ /\. {
        deny all;
    }
}

Gzip压缩

启用Gzip

gzip on;
gzip_vary on;
gzip_min_length 1000;
gzip_comp_level 6;
gzip_types text/plain text/css text/xml text/javascript application/json application/javascript application/xml+rss;

完整示例

生产环境配置

server {
    listen 80;
    server_name static.example.com;

    root /var/www/static;
    index index.html;

    # Gzip压缩
    gzip on;
    gzip_vary on;
    gzip_min_length 1000;
    gzip_comp_level 6;
    gzip_types text/plain text/css text/xml text/javascript application/json application/javascript application/xml+rss;

    # 静态资源
    location ~* \.(jpg|jpeg|png|gif|webp|svg|ico)$ {
        expires 30d;
        add_header Cache-Control "public";
    }

    # CSS和JS
    location ~* \.(css|js)$ {
        expires 30d;
        add_header Cache-Control "public";
    }

    # 字体
    location ~* \.(woff|woff2|ttf|otf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 禁止访问隐藏文件
    location ~ /\. {
        deny all;
    }

    # 自定义错误页面
    error_page 404 /404.html;
    error_page 500 502 503 504 /50x.html;
}

目录列表

启用目录列表

location / {
    autoindex on;
    autoindex_exact_size on;
    autoindex_localtime on;
}

禁用目录列表

location / {
    autoindex off;
}

防盗链

基本防盗链

location ~* \.(jpg|jpeg|png|gif|webp|svg|ico)$ {
    valid_referers none blocked server_names *.example.com example.com;
    if ($invalid_referer) {
        rewrite ^/.*$ /images/default.png last;
    }

    expires 30d;
    add_header Cache-Control "public";
}

完整示例

生产环境配置

server {
    listen 80;
    server_name static.example.com;

    root /var/www/static;
    index index.html;

    # Gzip压缩
    gzip on;
    gzip_vary on;
    gzip_min_length 1000;
    gzip_comp_level 6;
    gzip_types text/plain text/css text/xml text/javascript application/json application/javascript application/xml+rss;

    # 静态资源
    location ~* \.(jpg|jpeg|png|gif|webp|svg|ico)$ {
        valid_referers none blocked server_names *.example.com example.com;
        if ($invalid_referer) {
            rewrite ^/.*$ /images/default.png last;
        }

        expires 30d;
        add_header Cache-Control "public";
    }

    # CSS和JS
    location ~* \.(css|js)$ {
        expires 30d;
        add_header Cache-Control "public";
    }

    # 字体
    location ~* \.(woff|woff2|ttf|otf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 禁止访问隐藏文件
    location ~ /\. {
        deny all;
    }

    # 自定义错误页面
    error_page 404 /404.html;
    error_page 500 502 503 504 /50x.html;
}

总结

搭建静态文件服务器的关键点：

• 基本配置：root、index、try_files
• 缓存配置：expires、Cache-Control
• Gzip压缩：gzip、gzip_types
• 防盗链：valid_referers
• 目录列表：autoindex

使用Nginx搭建静态文件服务器，提高静态资源访问速度。