Skip to main content

Nginx 静态网站部署

阿里云​

前提条件​

  • root 身份登陆
  • 80, 443 端口未被占用

安装 Nginx​

sudo apt update
sudo apt install nginx

# Check installation success
sudo systemctl status nginx

配置防火墙​

sudo ufw app list

sudo ufw allow 'Nginx Full'
sudo ufw status

  • Nginx Full: 此配置文件同时打开端口 80（普通未加密的网页流量）和端口 443（TLS/SSL 加密流量）。
  • Nginx HTTP: 此配置文件仅打开端口 80（普通未加密的网页流量）。
  • Nginx HTTPS: 此配置文件仅打开端口 443（TLS/SSL 加密流量）。

测试安装​

http://YOUR_IP

Nginx 配置文件结构以及最佳实践​

  • 所有的 Nginx 配置文件都在 /etc/nginx/目录下。
  • 主要的 Nginx 配置文件是 /etc/nginx/nginx.conf。
  • 为每个域名创建一个独立的配置文件，便于维护服务器。你可以按照需要定义任意多的 block 文件。
  • Nginx 服务器配置文件被储存在 /etc/nginx/sites-available 目录下。在 /etc/nginx/sites-enabled 目录下的配置文件都将被 Nginx 使用。
  • 最佳推荐是使用标准的命名方式。例如，如果你的域名是 mydomain.com，那么配置文件应该被命名为 /etc/nginx/sites-available/mydomain.com.conf
  • 如果你在域名服务器配置块中有可重用的配置段，把这些配置段摘出来，做成一小段可重用的配置。
  • Nginx 日志文件(access.log 和 error.log)定位在 /var/log/nginx/目录下。推荐为每个服务器配置块，配置一个不同的 access 和 error。

你可以将你的网站根目录设置在任何你想要的地方。最常用的网站根目录位置包括：

  • /home/<user_name>/<site_name>
  • /var/www/<site_name>
  • /var/www/html/<site_name>
  • /opt/<site_name>

设置新的 nginx 服务 block​

your_domain: xiaokaup.me

创建新静态网站位置

sudo mkdir -p /var/www/xiaokaup.me/html
sudo chown -R $USER:$USER /var/www/xiaokaup.me/html

# 确保权限
sudo chmod -R 755 /var/www/xiaokaup.me

创建静态网站首页 html

sudo nano /var/www/xiaokaup.me/html/index.html
/var/www/xiaokaup.me/html/index.html
<html>
  <head>
    <title>Welcome to xiaokaup.me!</title>
  </head>
  <body>
    <h1>Success! The xiaokaup.me server block is working!</h1>
  </body>
</html>

为了让 Nginx 提供此内容，需要创建一个包含正确指令的服务器块。我们不直接修改默认配置文件，而是在 /etc/nginx/sites-available/xiaokaup.me 创建一个新的配置文件：

sudo nano /etc/nginx/sites-available/xiaokaup.me
/etc/nginx/sites-available/xiaokaup.me
server {
        listen 80;
        listen [::]:80;

        root /var/www/xiaokaup.me/html;
        index index.html index.htm index.nginx-debian.html;

        server_name xiaokaup.me www.xiaokaup.me;

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

请注意，我们已经将根配置更新到新目录，并且将 server_name 更新为我们的域名。

接下来，让我们通过在 sites-enabled 目录中创建一个链接来启用该文件，Nginx 在启动期间会从该目录读取：

sudo ln -s /etc/nginx/sites-available/xiaokaup.me /etc/nginx/sites-enabled/
info

Nginx 使用一种称为符号链接（symbolic links）或符号连接（symlinks）的常见做法来跟踪哪些服务器块被启用。创建符号链接就像在磁盘上创建快捷方式，这样如果你想关闭并保留它，就可以从 sites-enabled 目录中删除快捷方式，同时在 sites-available 中保留服务器块。

配置情况​

现在启用了两个服务器块，并配置为根据其监听和 server_name 指令响应请求：

your_domain：将响应对 your_domain 和 www.your_domain 的请求。
default：将响应端口 80 上与其他两个块不匹配的任何请求。

其他配置​

为了避免因添加额外服务器名称而可能出现的哈希桶内存问题，需要在 /etc/nginx/nginx.conf 文件中调整一个值。打开该文件：

sudo nano /etc/nginx/nginx.conf

找到 server_names_hash_bucket_size 指令并删除 # 符号来取消注释该行。如果你使用的是 nano 编辑器，可以通过按 CTRL 和 w 键来快速搜索文件中的单词。

/etc/nginx/nginx.conf
...
http {
    ...
    server_names_hash_bucket_size 64;
    ...
}
...

重启 nginx 服务​

验证配置是否正确

sudo nginx -t

重启服务

sudo systemctl restart nginx
sudo systemctl status nginx

熟悉重要的 Nginx 文件和目录​

内容

  • /var/www/html: 实际的网络内容，默认情况下仅包含您之前看到的默认 Nginx 页面，从 /var/www/html 目录提供服务。这可以通过修改 Nginx 配置文件来更改。

服务器配置

  • /etc/nginx: Nginx 配置目录。所有的 Nginx 配置文件都位于此处。
  • /etc/nginx/nginx.conf: 主要的 Nginx 配置文件。可以修改此文件来更改 Nginx 全局配置。
  • /etc/nginx/sites-available/: 可以存储每个站点服务器块的目录。除非链接到 sites-enabled 目录，否则 Nginx 不会使用此目录中的配置文件。通常，所有服务器块配置都在此目录中完成，然后通过链接到其他目录来启用。
  • /etc/nginx/sites-enabled/: 存储已启用的每站点服务器块的目录。通常，这些是通过链接到 sites-available 目录中的配置文件创建的。
  • /etc/nginx/snippets: 此目录包含可以在 Nginx 配置的其他地方包含的配置片段。可能重复的配置段适合重构为代码片段。

服务器日志

  • /var/log/nginx/access.log: 除非 Nginx 配置为其他方式，否则对您的 Web 服务器的每个请求都将记录在此日志文件中。
  • /var/log/nginx/error.log: 任何 Nginx 错误都将记录在此日志中。

配置 ssl 证书​

申请证书​

申请证书，通过设置 DNS 做申请认证。申请成功后，下载证书。

上传证书至服务器​

cd /var/www/xiaokaup.me
mkdir cert

scp -r ssl/17275139_xiaokaup.me_nginx-expire-at-2025-05-16/* <云服务器登录名>@<云服务器公网IP地址>:/var/www/xiaokaup.me/cert

更改 xiaokaup.com config 文件​

server {
     #HTTPS的默认访问端口443。
     #如果未在此处配置HTTPS的默认访问端口，可能会造成Nginx无法启动。
     listen 443 ssl;

     #填写证书绑定的域名
     server_name xiaokaup.me www.xiaokaup.me;

     #填写证书文件绝对路径
     ssl_certificate /var/www/xiaokaup.me/cert/xiaokaup.me.pem;
     #填写证书私钥文件绝对路径
     ssl_certificate_key /var/www/xiaokaup.me/cert/xiaokaup.me.key;

     ssl_session_cache shared:SSL:1m;
     ssl_session_timeout 5m;

     #自定义设置使用的TLS协议的类型以及加密套件（以下为配置示例，请您自行评估是否需要配置）
     #TLS协议版本越高，HTTPS通信的安全性越高，但是相较于低版本TLS协议，高版本TLS协议对浏览器的兼容性较差。
     ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
     ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3;

     #表示优先使用服务端加密套件。默认开启
     ssl_prefer_server_ciphers on;


    location / {
        root html;
        index index.html index.htm;
    }
}

server {
    listen 80;
    listen [::]:80;

    root /var/www/xiaokaup.me/html;
    index index.html index.htm index.nginx-debian.html;

    server_name xiaokaup.me www.xiaokaup.me;

    # 将所有HTTP请求通过rewrite指令重定向到HTTPS。
    rewrite ^(.*)$ https://$host$1;

    location / {
        try_files $uri $uri/ =404;
    }
    # location / {
    #     index index.html index.htm;
    # }
}

重启 nginx 服务​

link

上传/下载文件 (与服务器交互)​

操作系统: macOS
服务器系统: Linux

# 上传单个文件到实例
scp <本地文件路径> <云服务器登录名>@<云服务器公网IP地址>:<实例目录>

# 上传本地目录到实例
scp -r <本地目录> <云服务器登录名>@<云服务器公网IP地址>:<实例目录>

上传 build 文件夹到服务器对应位置

scp -r build/* <云服务器登录名>@<云服务器公网IP地址>:/var/www/xiaokaup.me/html

Resource​