ElIauk

Nginx 安装与静态网站部署

安装 Nginx 1.20 之后的主线版本都很稳定,装法按系统来: # CentOS / RHEL sudo yum install -y nginx sudo systemctl enable --now nginx # Ubuntu / Debian sudo apt update &

评论
Nginx 安装与静态网站部署

安装

Nginx 1.20 之后的主线版本都很稳定,装法按系统来:

  # CentOS / RHEL
sudo yum install -y nginx
sudo systemctl enable --now nginx

  # Ubuntu / Debian
sudo apt update && sudo apt install -y nginx

装完先确认版本和服务状态:

nginx -v
systemctl status nginx
curl -I http://localhost

能返回 200 OK 就说明默认站点已经跑起来了。Windows 上可以下 zip 包解压,在解压目录执行 start nginx,但正式部署还是建议用 Linux。

配置结构

不同发行版的目录略有差异,但核心就几个:

路径 作用
/etc/nginx/nginx.conf 主配置,包含全局设置和 include
/etc/nginx/conf.d/*.conf 常见的主机配置,被主配置 include
/etc/nginx/sites-enabled/ Debian 系的主机配置目录
/usr/share/nginx/html 默认静态文件目录
/var/log/nginx/access.log 访问日志
/var/log/nginx/error.log 错误日志,排查必看

自己的站点配置建议单独建一个 conf.d/my-site.conf,不要直接改 nginx.conf。配置多了以后,单独文件更好维护,也方便整份拷贝到别的机器。

主配置里,events 块管连接数,http 块放 include、日志格式、gzip 这类公共配置,server 块才代表一个站点。层级搞清楚,改配置时就知道该写在哪。

include 让配置可以拆文件,conf.d/*.conf 就是被主配置引进来的。新建站点时复制一份现有配置改 server_name 和 root,比从零写快,也不容易漏掉公共设置。

开启 gzip 能明显减小 js、css 的传输体积,在 http 块里配 gzip on; gzip_types text/css application/javascript; 即可。图片、视频本身已压缩,不要再 gzip,白费 CPU。

日志格式可以在 http 块里用 log_format 自定义,加上 $request_time、$upstream_response_time 能区分是 Nginx 慢还是后端慢,排查性能问题时非常有用。

部署一个静态站

把打包好的 dist 目录上传到 /var/www/my-site,然后写一个 server 块:

server {
    listen 80;
    server_name example.com;

    root /var/www/my-site;
    index index.html;

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

    location ~* \.(js|css|png|jpg|svg|woff2)$ {
        expires 7d;
        add_header Cache-Control "public";
    }
}

root 指定站点根目录,index 指定默认页。try_files $uri $uri/ /index.html 是给前端单页应用准备的:访问 /user/1 时服务器上并没有这个文件,就回退到 index.html,由前端路由接管;没有这行,刷新非首页会直接 404。

expires 7d 让静态资源在浏览器缓存 7 天。注意 index.html 不能跟着缓存,否则前端发版后用户还拿着旧页面去加载已经改名的 js 文件。

常用命令

sudo nginx -t                 # 检查配置语法,改完必做
sudo nginx -s reload          # 平滑重载,不断开现有连接
sudo systemctl reload nginx   # 用 systemd 管理的等价写法
sudo nginx -T | grep server_name   # 打印最终生效的完整配置

nginx -t 输出 syntax is ok 和 test is successful 两行才算通过。重载前一定先测,配置写错时 reload 会失败,但老进程还在跑,现象是“改了没反应”。

平滑重载的原理是 master 进程启动新的 worker,再让老 worker 处理完手头请求后退出,所以 reload 期间连接不会断。但如果配置里有语法错误,reload 会失败并保留旧配置,这时 nginx -t 报出的行号就是最关键的信息。

常见坑

1. 403 Forbidden

先看 error.log 里的 Permission denied。常见原因是静态目录或文件对 nginx 用户不可读,目录缺少 x 权限。用 namei -l /var/www/my-site/index.html 逐级看权限。CentOS 开了 SELinux 时,文件还需要正确的安全上下文,可以用 ls -Z 确认,或临时 setenforce 0 验证是不是 SELinux 拦的。

2. 404 Not Found

检查 root 拼接后的真实路径:root /var/www/my-site 加请求 /css/app.css,实际找的是 /var/www/my-site/css/app.css。用 alias 时末尾斜杠要和 location 对上,否则路径会少一层或多一层。

3. 配置改了不生效

按顺序排查:nginx -t 有没有通过、配置文件在不在被 include 的目录里、reload 有没有执行成功、浏览器是不是缓存了旧页面。用 nginx -T 看最终生效的配置,比猜快得多。

4. index.html 被缓存

静态资源加了 expires 7d,结果 index.html 也被缓存,前端发版后用户看到的还是旧页面。给 index.html 单独加 add_header Cache-Control "no-cache",或者用带 hash 的文件名并让入口文件不缓存。

5. 中文文件名访问 404

URL 里的中文会被浏览器编码成 %E4%B8%AD,服务器上文件名如果是 GBK 编码就会对不上。静态资源尽量用英文加短横线命名,省掉这一类编码问题。

排查步骤

  1. sudo nginx -t 确认配置语法;
  2. tail -f /var/log/nginx/error.log,复现一次请求,看具体报错;
  3. curl -I http://localhost/ 看状态码和响应头,绕过浏览器缓存;
  4. ps -ef | grep nginx 确认 worker 进程在跑,ss -lntp | grep 80 确认端口监听;
  5. 403 查权限和 SELinux,404 查路径拼接,502 则是后端没起来,和静态站不是一类问题。

参考

评论

推荐阅读

订阅邮件

订阅更新,及时收到最新文章。

作者