ubuntu

การติดตั้ง Nginx บน Ubuntu 18.04 LTS

By KDBEER | Last updated Feb 5, 2021
การติดตั้ง-Nginx-บน-Ubuntu--18.04-LTS-5f363acfec76f739efc66155

Nginx คืออะไร

Nginx เป็น Open Source Software ที่นิยมใช้งานมากๆ สำหรับทำ Web Server เนื่องจาก Nginx ความสามารถในการรับมือกับเว็บไวต์ที่มีขนาดใหญ่ และมี Traffic สูงๆ ได้ และเจ้า Nginx นี่ก็ยังเบามากๆ ติดตั้งง่าย และการ Config หรือปรับแต่ง ก็ทำได้ง่ายๆ เพียงแค่การแก้ไฟล์ Configuration เท่านั้น

บทความนี้ประกอบด้วย

  1. การติดตั้ง Nginx
  2. ปรับแต่ง Firewall
  3. ตรวจสอบการติดตั้ง และสถานะ Server
  4. การจัดการ Process ของ Nginx ( stop | start | reload | reload | disable | enable )
  5. ลองติดตั้ง Website
  6. รู้จักกับ Nginx ไฟล์ และ Folder ต่างๆ ของ Nginx
  7. สรุป

1. การติดตั้ง Nginx

เราสามารถติดตั้ง Nginx ง่ายๆ ผ่าน Ubuntu Repository ได้เลย โดยใช้ apt

sudo apt update
sudo apt install nginx

2. ปรับแต่ง Firewall

เนื่องจาก Nginx ทำงานบน Port 80 (default) เพื่อให้ Client เรียกมาที่ Process ของ nginx ได้ ดังนั้น เราจำเป็นต้องอนุญาตให้ port ที่จำเป็นสามารถ Access ได้ แต่ต้องบอกว่าถ้าเราใช้ VM ผู้ให้บริการคลาวด์อย่าง AWS, GCP, Digital Ocean Port พื้นฐานพวกนี้เขาจะเปิดให้อยู่แล้วตอนสร้าง VM และเราก็ไปปรับที่ Firewall ของแต่ละผู้ให้บริการคลาวด์เอาเอง

แต่ถ้าผู้อ่านอยากจะใช้งาน Nginx ที่ On Premise หรือคอมพิวเตอร์ของเราเอง หน้าที่เราก็ต้องไปตรวจสอบว่า Port เหล่านี้ทำงานอยู่หรือเปล่า

เริ่มจากทำการ List configuration ของ ufw (ubuntu firewall) 

sudo ufw app list

จะได้ผลลัพธ์ประมาณนี้

Available applications:
  Nginx Full
  Nginx HTTP
  Nginx HTTPS
  OpenSSH

แนะนำให้ enable Nginx HTTP  เพื่อให้ Port 80 สามารถใช้งานได้

sudo ufw allow 'Nginx HTTP'

ลองตรวจสอบ List ของ Firewall

sudo ufw status

จะได้ผลลัพธ์ประมาณนี้ครับ

Status: active

To                         Action      From
--                         ------      ----
OpenSSH                    ALLOW       Anywhere                  
Nginx HTTP                 ALLOW       Anywhere                  
OpenSSH (v6)               ALLOW       Anywhere (v6)             
Nginx HTTP (v6)            ALLOW       Anywhere (v6)

3. ตรวจสอบการติดตั้ง และสถานะ Server

การตรวจสอบสถานะของ Nginx สามารถทำได้ง่ายๆ โดยใช้คำสั่งต่อไปนี้

service nginx status

ถ้าติดตั้งถูกต้อง ควรจะเห็นสถานะของ nginx นั้น Active อยู่ครับ

● nginx.service - A high performance web server and a reverse proxy server
   Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
   Active: active (running) since Thu 2020-06-04 16:49:19 UTC; 2 months 9 days ago
     Docs: man:nginx(8)
 Main PID: 862 (nginx)
    Tasks: 2 (limit: 1967)
   CGroup: /system.slice/nginx.service
           ├─ 862 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
           └─3693 nginx: worker process

และถ้าเราเข้าใช้งานผ่าน Browser โดยไปที่ port 80

http://localhost:80 # ลองติดตั้งบนคอมพิวเตอร์ของเราเอง
http://<domain>:80 # ลอง Server

ควรจะเห็นผลลัพธ์ประมาณนี้ครับ

https://cdn.wp.nginx.com/wp-content/uploads/2014/01/welcome-screen-e1450116630667.png

 

4. การจัดการ Process ของ Nginx ( stop | start | restart | reload | disable | enable )

การจัดการกับ Process ต่างๆ ทำได้ดังนี้ครับ

ต้องการ stop process ของ  Nginx

sudo systemctl stop nginx

ต้องการ start process ของ  Nginx

sudo systemctl start nginx

ต้องการ restart process ของ  Nginx

sudo systemctl restart nginx

ต้องการ reload process ของ  Nginx

sudo systemctl reload nginx

ต้องการ disable service ของ  Nginx เพื่อไม่ให้ start ขึ้นมาเองตอนที่ OS มัน Boot ขึ้นมา

sudo systemctl disable nginx

ต้องการ enable service ของ  Nginx เพื่อให้ Nginx start ขึ้นมาเองตอนที่ OS มัน Boot ขึ้นมา

sudo systemctl enable nginx

5. ลองติดตั้ง Website

ต่อไปนี้จะเป็นตัวอย่างในการเขียน web page ง่ายๆ และลองเอาไปดีพลอยบน ubuntu โดยใช้ nginx เป็น web server ครับ โดยเราต้องสร้างโฟลเดอร์ที่ใช้ในการเก็บ resource ไฟล์ครับ

sudo mkdir -p /var/www/nginx-ubuntu-hello/html

อนุญาตสิทธิ์ให้กับ โฟลเดอร์ที่สร้างขึ้นมาครับ

sudo chown -R $USER:$USER /var/www/nginx-ubuntu-hello/html

แก้ไข Permission ของโฟลเดอร์

sudo chmod -R 755 /var/www/nginx-ubuntu-hello

จากนั้นสร้างไฟล์ index.html ครับ ซึ่งไฟล์นี้นี่คือไฟล์ Web page ครับ

nano /var/www/nginx-ubuntu-hello/html/index.html

แล้ว copy code ด้านล่างนี้ไปแปะในไฟล์ดังกล่าวครับ

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>การติดตั้ง Nginx บน Ubuntu 18.04 LTS</title>
    <style>
      body {
        margin-top: 100px;
      }

      .container {
        width: 70%;
        margin: 0 auto;
      }

      .center {
        text-align: center;
      }

      .images {
        height: 500px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
      }

      .image {
        text-align: center;
      }

      .image img {
        width: 65%;
      }
    </style>
  </head>
  <body>
    <div class="container center">
      <h1>Hi Dev!!</h1>
      <h3>การติดตั้ง Nginx บน Ubuntu 18.04 LTS</h3>
    </div>
    <div class="container images">
      <div class="image">
        <img
          src="https://huongdanjava.com/wp-content/uploads/2020/05/nginx.png"
          alt="nginx logo"
          srcset=""
        />
      </div>
      <div class="image">
        <img
          src="https://149366088.v2.pressablecdn.com/wp-content/uploads/2020/04/ubuntu-focal-logo-Untitled-1.jpg"
          alt="ubutnu 20 logo"
          srcset=""
        />
      </div>
    </div>
  </body>
</html>

เป็นอันว่าตอนนี้นั้น เราสร้างไฟล์เพื่อที่จะเก็บ resource ต่างๆ เรียบร้อยแล้ว ต่อจากนี้ เราต้องบอกกับ Nginx ให้รู้จักไฟล์ของเราครับ โดยการเพิ่ม Config ไว้ที่ /etc/nginx/sites-available โดยใช้ขั้นตอนต่อไปนี้ครับ

sudo nano /etc/nginx/sites-available/nginx-ubuntu-hello

จากนั้นวางโค๊ดนี้ลงไปครับ

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

        root /var/www/nginx-ubuntu-hello/html;
        index index.html index.htm index.nginx-debian.html;

        server_name nginx-ubuntu-hello www.nginx-ubuntu-hello;

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

เพื่อทดสอบว่า config ถูกหรือไม่ เราจะใช้คำสั่งต่อไปนี้ครับ

sudo nginx -t

ถ้าไม่มีปัญหาอะไรก็ reload start nginx เพื่อให้ web page ของเราทำงานได้เลยครับ

sudo systemctl restart nginx

จากนั้นลองเข้า browser และไปที่ http://localhost:80 ควรจะเห็นผลลัพธ์ดังนี้ครับ

 

6. รู้จักกับ Nginx ไฟล์ และ Folder ต่างๆ ของ Nginx

Nginx มีโฟลเดอร์และไฟล์ต่างๆ ที่น่าสนใจ และถ้าเราเอา Nginx มาใช้งาน เราจำเป็นที่จะต้องรู้จัก ดังนี้ครับ

Content 

  • /var/www/html ใช้เก็บไฟล์ resource ของ website ของเรา อย่างในตัวอย่างที่ผ่านมา แต่เราก็สามารถเปลี่ยนได้นะครับ และแก้ Config ของ Nginx ให้ชี้ไปที่โฟลเดอร์ดังกล่าวก็ได้ครับ

Server Configuration

  • /etc/nginx ใช้เก็บ nginx ต่างๆ ของ Nginx
  • /etc/nginx/nginx.conf นี่คือไฟล์หลักของ nginx เลย เราสามารถแก้ไฟล์นี้ เพื่อปรับแต่ง Nginx ได้
  • /etc/nginx/sites-enabled/ ในหนึ่ง Server เราอาจจะมีหลายเว็บไซต์ โฟลเดอร์นี้ จะใช้เก็บ Config ของแต่ละ website หรือโดเมนนั้นๆ
  • /etc/nginx/snippets โฟลเดอร์นี้ เราสามารถสร้าง ไฟล์ config แต่เป็นแค่ file เล็กๆ เพื่อเอาไป include เขาไปใน Config อีกทีนึง ถ้าเราเคยเขียนโปรแกรมมาบ้าง มันคล้ายๆ กับ METHOD นั่นเอง

Server Logs

  • /var/log/nginx/access.log ทุกๆ request ที่เรียกเข้ามาที่ web server จะถูกบันทึกไว้ที่ไฟล์นี้ครับ
  • /var/log/nginx/error.log ทุกๆ error ที่เกิดขึ้น ไม่ว่าจะจาก service nginx เอง  หรือจาก config เอง จะถูกบันทึกไว้ที่ไฟล์นี้ครับ

7. สรุป

ในบทความนี้ ผมได้อธิบายวิธีการติดตั้ง Nginx บน Ubutu 18.04 และได้อธิบายวิธีการดีพลอยเว็บไซต์บน Nginx แบบง่ายๆ สุดท้ายผมอธิบายถึง Folder ที่เกี่ยวข้องและใช้งานบ่อยๆ ของ Nginx 

เอาละครับ ขอขอบคุณทุกท่านมากๆ ที่แวะเข้ามาอ่าน หวังว่าบทความนี้ จะเป็นประโยชน์ต่อผู้อ่านนะครับ

 

Resource อื่นๆ

สร้าง Ubuntu Server ภายใน 10 นาที บน Google Cloud

https://youtu.be/A4WrKXjftAU

วิธีการสมัครใช้งาน Google Cloud และรับเครดิตทดลองใช้ $300 ฟรี !!

https://youtu.be/A2bAsEw0wt8

Reference

https://nginx.org/en/docs/

https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-20-04

Tags