[Sprint] nginx Web Server Hands-on

⭐ HTTP 기반의 서버를 생성하는 소프트웨어인 nginx를 사용하여, 웹 서버(Web Server)를 생성하여 정적 웹페이지 호스팅을 따라 해보세요.

1. nginx 설치

$ sudo apt-get update
$ sudo apt-get install nginx
$ sudo nginx -v

nginx version: nginx/1.18.0 (Ubuntu)

2. nginx.conf 파일 구조 확인하기

$ cat /etc/nginx/nginx.conf

###Core 모듈 설정 부분#
user www-data;
	#Default: nobody
	#작업자 프로세스에서 사용하는 자격 증명을 user정의 합니다.
  #group생략 하면 group이름이 같은 그룹이 user사용됩니다.
worker_processes auto;
	#Default: 1
	#nginx의 실행가능한 worker 프로세스의 수를 지정해 줄 수 있습니다.
	#nginx는 master와 worker프로세스로 구성되어 지는데요.
	#공식문서에 의하면, 최적값은 cpu core에서부터 하드드라이브등 
	#여러가지 요소에 의해서 결정되어 지며,auto로 설정하면 자동으로 이 값을 찾아준다고 합니다.

pid /run/nginx.pid;
	#nginx의 프로세스 아이디 (pid)가 저장되는 경로
include /etc/nginx/modules-enabled/*.conf;
	#포함시킬 외부파일을 정의한다. 
	#위의 파일에 작성되어진 내용들을 현재 파일로 가져오는 것을 뜻
#error_log  logs/error.log;
	#nginx 의 에러 로그가 쌓이는 경로
#worker_rlimit_nofile 8192;
	#Worker process들에서 최대로 열린 파일들의 수를 제한할 수 있습니다.
	#이 수가 클수록 메인 프로세스를 재시작 할 필요가 없어진다고 합니다.
	#대신 열려 있는 파일의 수만큼 서버에 부하가 발생

Events 블록##
events {
	worker_connections 768;
		#Worker Process가 동시에 처리할 수 있는 접속자의 수를 나타낸다. 
		#기본은 1024로 설정되어져 있다.
		#worker_rlimit_nofile 의 숫자를 넘어서면 안됨
	# multi_accept on;
		#off로 되어있으면, worker프로세스는 한번에 하나의 커넥션만을 허용합니다.
		#on으로 되어있다면, 모든 새로운 커넥션을 한번에 다 허용할 수 있습니다.
}

##http 블록##
http {

	##
	# Basic Settings
	##

	sendfile on;
	tcp_nopush on;
	types_hash_max_size 2048;
	# server_tokens off;

	# server_names_hash_bucket_size 64;
	# server_name_in_redirect off;

	include /etc/nginx/mime.types;
	default_type application/octet-stream;

	##
	# SSL Settings
	##

	ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
	ssl_prefer_server_ciphers on;

	##
	# Logging Settings
	##

	access_log /var/log/nginx/access.log;
	error_log /var/log/nginx/error.log;

	##
	# Gzip Settings
	##

	gzip on;

	# gzip_vary on;
	# gzip_proxied any;
	# gzip_comp_level 6;
	# gzip_buffers 16 8k;
	# gzip_http_version 1.1;
	# gzip_types text/plain text/css application/json application/javascript 
  #text/xml application/xml application/xml+rss text/javascript;

	##
	# Virtual Host Configs
	##

	include /etc/nginx/conf.d/*.conf;
	include /etc/nginx/sites-enabled/*;

	#upstream backend {
	#	server 127.0.0.1:3000;
	#	keepalive 32;
	#}
	#upstream 지시어는 upstream서버에 대해서 설정하기 위한 것인데요.
	#인자로 설정할 upstream서버의 이름을 넣어주면 됩니다.
	#서버들은 TCP이든 UNIX 도메인 소켓이든 모두 listen할 수 있습니다.
	#아래에서는 backend라는 이름으로, 내부의 nodeJS의 3000포트 서버로 
	#연결시켜 주도록 하였네요.
	#keepalive를 하는 이유는 proxy서버로부터, 다시 로컬의 nodejs서버로 연결될 때,
	#접속이 다시 생성됨으로 인한 비효율을 막기 위해서 입니다.
}

##mail 블록##

#mail {
#	# See sample authentication script at:
#	# http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
#
#	# auth_http localhost/auth.php;
#	# pop3_capabilities "TOP" "USER";
#	# imap_capabilities "IMAP4rev1" "UIDPLUS";
#
#	server {
#		listen     localhost:110;
#		protocol   pop3;
#		proxy      on;
#	}
#
#	server {
#		listen     localhost:143;
#		protocol   imap;
#		proxy      on;
#	}
#}


##server 블록##
#한 서버(한 개의 ip)에서 각각의 도메인에 따라서 서로 다른 페이지를 서비스할 수 있습니다.
#예를들어, 서로 다른 도메인 (minimilab-zzang.com과 minimilab.com) 을 
#한 서버에서 서로 다른 페이지를 서비스 하도록 할 수 있습니다.
#minimilab-zzang.com 도메인으로 요청이 들어오면 /var/www/minimilab-zzang.com 
#위치의 페이지를 서비스 하도록 하며,
#minimilab.com 도메인으로 요청이 들어오면 /var/www/minimilab.com 
#위치에서 페이지를 서비스 합니다.
#server {
#    server_name  minimilab-zzang.com;
#    root /var/www/minimilab-zzang.com
#}

#server {
#    server_name  minimilab.com
#    root /var/www/minimilab.com
#

#location = /robots.txt {
#           root /usr/static; //파일 경로
#        try_files /robots.txt /robots.txt;
#    }
#}
#location / {
#      proxy_pass         http://127.0.0.1/;
#      proxy_redirect     off;
#
#      proxy_set_header   Host             $host;
#      proxy_set_header   X-Real-IP        $remote_addr;
#      # proxy_set_header  X-Forwarded-For  $proxy_add_x_forwarded_for;

#      client_max_body_size       10m;
#      client_body_buffer_size    128k;

#      client_body_temp_path      /var/nginx/client_body_temp;

#      proxy_connect_timeout      90;
#      proxy_send_timeout         90;
#      proxy_read_timeout         90;
#      proxy_send_lowat           12000;

#      proxy_buffer_size          4k;
#      proxy_buffers              4 32k;
#      proxy_busy_buffers_size    64k;
#      proxy_temp_file_write_size 64k;

#     proxy_temp_path            /var/nginx/proxy_temp;

#      charset  koi8-r;

3. Hands-On) 기본 샘플 페이지 테스트

# nginx web server 실행
$ sudo systemctl nginx start

http://localhost 접속 확인

4. 기본(root) 페이지 위치 확인하기

$ cat /etc/nginx/sites-available/default

server {
  ## 사용할 port
	listen 80 default_server;
	listen [::]:80 default_server;

	# SSL configuration
	#
	# listen 443 ssl default_server;
	# listen [::]:443 ssl default_server;
	#
	# Note: You should disable gzip for SSL traffic.
	# See: https://bugs.debian.org/773332
	#
	# Read up on ssl_ciphers to ensure a secure configuration.
	# See: https://bugs.debian.org/765782
	#
	# Self signed certs generated by the ssl-cert package
	# Don't use them in a production server!
	#
	# include snippets/snakeoil.conf;

  ## root page 위치
	root /var/www/html;

	# Add index.php to the list if you are using PHP
	index index.html index.htm index.nginx-debian.html;

	server_name _;

	location / {
		# First attempt to serve request as file, then
		# as directory, then fall back to displaying a 404.
		try_files $uri $uri/ =404;
	}

	# pass PHP scripts to FastCGI server
	#
	#location ~ .php$ {
	#	include snippets/fastcgi-php.conf;
	#
	#	# With php-fpm (or other unix sockets):
	#	fastcgi_pass unix:/run/php/php7.4-fpm.sock;
	#	# With php-cgi (or other tcp sockets):
	#	fastcgi_pass 127.0.0.1:9000;
	#}

	# deny access to .htaccess files, if Apache's document root
	# concurs with nginx's one
	#
	#location ~ /.ht {
	#	deny all;
	#}
}

5. Hands-On) 새로운 웹 페이지 호스팅하기

새로운 HTML 파일 생성

/home/oh/codeStates/nginxHandsOn/index.html

<!DOCTYPE html>
<html>
  <head>
    <title>My Awesome Web</title>
  </head>
  <body>
    <h1>Hello World</h1>
    <p>This is for Codestates DevOps Bootcamp!</p>
  </body>
</html>

nginx.conf 파일의 Server 블록 수정

server {
       listen 10024;
       server_name localhost;

       location / {
           root /home/oh/codeStates/nginxHandsOn;
           index index.html;
       }
}

새로운 웹 페이지 확인하기

Leave a Comment