如何在 Ubuntu 20.04 (Nginx) 上使用 Ansible 部署静态 HTML 网站


该系列的一部分：
如何编写 Ansible Playbooks

Ansible 是一种现代配置管理工具，不需要在远程节点上使用代理软件，仅使用 SSH 和 Python 在托管服务器上进行通信和执行命令。本系列将带您了解可用于编写服务器自动化剧本的主要 Ansible 功能。最后，我们将看到一个实际示例，说明如何创建剧本以自动设置远程 Nginx Web 服务器并向其部署静态 HTML 网站。

如果您一直在学习本系列的所有部分，那么此时您应该熟悉安装系统包、应用模板以及在 Ansible playbook 中使用处理程序。在本系列的这一部分中，您将使用迄今为止所见的内容创建一个剧本，该剧本可自动设置远程 Nginx 服务器以在 Ubuntu 20.04 上托管静态 HTML 网站。

首先在您的 Ansible 控制节点上创建一个新目录，您将在其中设置 Ansible 文件和一个要部署到远程服务器的演示静态 HTML 网站。这可以位于您的主文件夹中您选择的任何位置。在这个例子中，我们将使用~/ansible-nginx-demo.

  • mkdir ~/ansible-nginx-demo

  • cd ~/ansible-nginx-demo

接下来，将现有的清单文件复制到新目录中。在此示例中，我们将使用您在本系列开头设置的相同广告资源：

  • cp ~/ansible-practice/inventory .

这将复制inventory从ansible-practice主目录中命名的文件夹命名的文件，并将其保存到当前目录。

获取演示网站

在此演示中，我们将使用一个静态 HTML 网站，它是我们如何在 HTML 中编码系列的主题。首先通过运行以下命令下载演示网站文件：

  • curl -L https://github.com/do-community/html_demo_site/archive/refs/heads/main.zip -o html_demo.zip

您需要unzip解压缩此下载的内容。要确保安装了此工具，请运行：

  • sudo apt install unzip

然后，使用以下命令解压缩演示网站文件：

  • unzip html_demo.zip

这将创建一个html_demo_site-main在当前工作目录上调用的新目录。您可以使用以下ls -la命令检查目录的内容：

  • ls -la html_demo_site-main

Output
total 28
drwxrwxr-x 3 sammy sammy 4096 sep 18  2020 .
drwxrwxr-x 5 sammy sammy 4096 mrt 25 15:03 ..
-rw-rw-r-- 1 sammy sammy 1289 sep 18  2020 about.html
drwxrwxr-x 2 sammy sammy 4096 sep 18  2020 images
-rw-rw-r-- 1 sammy sammy 2455 sep 18  2020 index.html
-rw-rw-r-- 1 sammy sammy 1079 sep 18  2020 LICENSE
-rw-rw-r-- 1 sammy sammy  675 sep 18  2020 README.md

为 Nginx 的配置创建模板

您现在将设置配置远程 Web 服务器所需的 Nginx 模板。在您的ansible-demo目录中创建一个新文件夹来保存非剧本文件：

  • mkdir files

然后，打开一个名为 的新文件nginx.conf.j2：

  • nano files/nginx.conf.j2

此模板文件包含静态 HTML 网站的 Nginx 服务器块配置。它采用三个变量：document_root，app_root，和server_name。稍后我们将在创建剧本时定义这些变量。将以下内容复制到您的模板文件中：

~/ansible-nginx-demo/files/nginx.conf.j2
server {
  listen 80;

  root {{ document_root }}/{{ app_root }};
  index index.html index.htm;

  server_name {{ server_name }};

  location / {
   default_type "text/html";
   try_files $uri.html $uri $uri/ =404;
  }
}

完成后保存并关闭文件。

创建一个新的 Ansible Playbook

接下来，我们将创建一个新的 Ansible playbook 并设置我们在本指南上一节中使用的变量。打开一个名为 的新文件playbook.yml：

  • nano playbook.yml

该 playbook 以hosts设置为的定义all和become指令开始，该指令告诉 Ansible默认以root用户身份运行所有任务（与手动运行命令相同sudo）。在这个剧本的var部分，我们将创建三个变量：server_name，document_root，和app_root。这些变量在 Nginx 配置模板中用于设置此 Web 服务器将响应的域名或 IP 地址，以及网站文件在服务器上所在位置的完整路径。对于这个演示，我们将使用ansible_default_ipv4.address fact 变量，因为它包含远程服务器的公共 IP 地址，但您可以将此值替换为您的服务器的主机名，以防它在 DNS 服务中正确配置了域名以指向该服务器：

~/ansible-nginx-demo/playbook.yml
---
- hosts: all
  become: yes
  vars:
    server_name: "{{ ansible_default_ipv4.address }}"
    document_root: /var/www/html
    app_root: html_demo_site-main
  tasks:

您可以暂时打开此文件。接下来的部分将引导您完成您需要包含在此剧本中以使其功能齐全的所有任务。

安装所需的软件包

以下任务将更新apt缓存，然后nginx在远程节点上安装包：

~/ansible-nginx-demo/playbook.yml
. . .
    - name: Update apt cache and install Nginx
      apt:
        name: nginx
        state: latest
        update_cache: yes

上传网站文件到远程节点

下一个任务将使用copy内置模块将网站文件上传到远程文档根目录。我们将使用该document_root变量在应创建应用程序文件夹的服务器上设置目标。

~/ansible-nginx-demo/playbook.yml
. . .
    - name: Copy website files to the server's document root
      copy:
        src: "{{ app_root }}"
        dest: "{{ document_root }}"
        mode: preserve

应用和启用自定义 Nginx 配置

我们现在将应用 Nginx 模板，该模板将配置 Web 服务器以托管您的静态 HTML 文件。配置文件设置为 后/etc/nginx/sites-available，我们将在里面创建一个指向该文件的符号链接，/etc/nginx-sites-enabled并通知 Nginx 服务进行后验重启。整个过程将需要两个独立的任务：

~/ansible-nginx-demo/playbook.yml
. . .
    - name: Apply Nginx template
      template:
        src: files/nginx.conf.j2
        dest: /etc/nginx/sites-available/default
      notify: Restart Nginx

    - name: Enable new site
      file:
        src: /etc/nginx/sites-available/default
        dest: /etc/nginx/sites-enabled/default
        state: link
      notify: Restart Nginx

在 UFW 上允许端口 80

接下来，包括在端口 80 上启用 tcp 访问的任务：

~/ansible-nginx-demo/playbook.yml
. . .
    - name: Allow all access to tcp port 80
      ufw:
        rule: allow
        port: '80'
        proto: tcp
. . .

为 Nginx 服务创建处理程序

要完成这个剧本，唯一要做的就是设置Restart Nginx处理程序：

~/ansible-nginx-demo/playbook.yml
. . .
  handlers:
    - name: Restart Nginx
      service:
        name: nginx
        state: restarted

运行完成的剧本

完成在剧本文件中包含所有必需的任务后，它将如下所示：

~/ansible-nginx-demo/playbook.yml
---
- hosts: all
  become: yes
  vars:
    server_name: "{{ ansible_default_ipv4.address }}"
    document_root: /var/www
    app_root: html_demo_site-main
  tasks:
    - name: Update apt cache and install Nginx
      apt:
        name: nginx
        state: latest
        update_cache: yes

    - name: Copy website files to the server's document root
      copy:
        src: "{{ app_root }}"
        dest: "{{ document_root }}"
        mode: preserve

    - name: Apply Nginx template
      template:
        src: files/nginx.conf.j2
        dest: /etc/nginx/sites-available/default
      notify: Restart Nginx

    - name: Enable new site
      file:
        src: /etc/nginx/sites-available/default
        dest: /etc/nginx/sites-enabled/default
        state: link
      notify: Restart Nginx

    - name: Allow all access to tcp port 80
      ufw:
        rule: allow
        port: '80'
        proto: tcp

  handlers:
    - name: Restart Nginx
      service:
        name: nginx
        state: restarted

要在您在清单文件中设置的服务器上执行此剧本，请ansible-playbook使用您在本系列介绍中运行连接测试时使用的相同连接参数运行。在这里，我们将使用名为清单文件inventory与萨米用户连接到远程服务器。因为 playbook 需要sudo运行，我们还包括在Ansible 提示时-K提供远程用户sudo密码的参数：

  • ansible-playbook -i inventory playbook.yml -u sammy -K

你会看到这样的输出：

Output
BECOME password: 

PLAY [all] **********************************************************************************************

TASK [Gathering Facts] **********************************************************************************
ok: [203.0.113.10]

TASK [Update apt cache and install Nginx] ***************************************************************
ok: [203.0.113.10]

TASK [Copy website files to the server's document root] *************************************************
changed: [203.0.113.10]

TASK [Apply Nginx template] *****************************************************************************
changed: [203.0.113.10]

TASK [Enable new site] **********************************************************************************
ok: [203.0.113.10]

TASK [Allow all access to tcp port 80] ******************************************************************
ok: [203.0.113.10]

RUNNING HANDLER [Restart Nginx] *************************************************************************
changed: [203.0.113.10]

PLAY RECAP **********************************************************************************************
203.0.113.10                : ok=7    changed=3    unreachable=0    failed=0    skipped=0    rescued=0    ignored=0

剧本完成后，如果您转到浏览器并访问服务器的主机名或 IP 地址，您现在应该看到以下页面：

Ansible 部署的 HTML 演示站点

恭喜，您已成功使用 Ansible 将静态 HTML 网站自动部署到远程 Nginx 服务器。

如果您对演示网站中的任何文件进行了更改，您可以再次运行剧本，该copy任务将确保任何文件更改都反映在远程主机中。因为 Ansible 具有幂等行为，多次运行 playbook 不会触发已经对系统进行的更改。

觉得文章有用？

点个广告表达一下你的爱意吧 ！😁