본문 바로가기

침착하게 Study/서버

[AWS,Nginx] Nginx 에러 페이지 수정 및 기본페이지 변경

nginx

 

 

기분 문법을 정리하고 해석을 다했으니까, 이제 기본적으로 Nginx를 수정해서 입맛게 맞게 변경해 보도록 해보겠습니다. 일단은 먼저 Nginx를 설치하자마자 기본적으로 만들어져 있는 index.html를 수정해 보도록 하겠습니다. 그러고 나서 사이트를 운영하다 보면 나올 수 있는 에러페이지수정, 그리고 기본페이지를 다른 새로운 페이지로 수정해서 서버에 띄우는 법을 배우겠습니다. 

 

1. Nginx 기본 웹 사이트 수정해보기

 

# 일단 기본 설정 파일이 있는 폴더로 이동합니다.
$ cd /etc/nginx/conf.d

# 설정 파일인 "default.conf" 파일을 수정을 해야되니 vim 명령어를 써서 열어줍니다.
$ vim default.conf

 

Nginx 기본 웹 사이트 수정해보기-1

 

server {
    listen       80; 
    server_name  localhost;


    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    # / 으로 시작하는 모든 경로를 처리 (ex. /index.html)
    location / {
        # /jscode.html로 요청이 들어오면 /usr/share/nginx/html/jscode.html 파일로 응답
        root   /usr/share/nginx/html;
        
        # /로 요청이 들어오면 /usr/share/nginx/html/index.html로 응답
        # 만약 /usr/share/nginx/html/index.html이 없을 경우, /usr/share/nginx/html/index.htm으로 응답
        index  index.html index.htm;
    }

    error_page   500 502 503 504  /50x.html;
    
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

 

파일을 열어서 수정해야 될 파일의 경로를 확인한다. 

Nginx 기본 웹 사이트 수정해보기-2

 

# 수정해야될 파일이 있는 곳으로 이동을 해줍니다. 
$ cd /usr/share/nginx/html

# "sudo" 명령어를 사용해서 index.html을 열어줍니다.
$ sudo vi index.html

Nginx 기본 웹 사이트 수정해보기-3

 

파일을 열어서 입력모드로 변경을 해줍니다. 

Nginx 기본 웹 사이트 수정해보기-4

 

현재는 기본 페이지를 보여줍니다. 

 

Nginx 기본 웹 사이트 수정해보기-5

 

그럼 이제 index 파일의 한 부분을 수정을 해봅니다. 

Nginx 기본 웹 사이트 수정해보기-6

 

파일 수정이 잘 되었는지. 서버로 접속을 해보았더니, 제가 수정한 문구 그래도 나온 것을 확인할 수가 있습니다. 

 

Nginx 기본 웹 사이트 수정해보기-7

 

 

 

2. Nginx 에러 페이지 수정해 보기

"default.conf" 파일을 열어보면, error_page에 대한 파일 경로와 파일 이름을 확인할 수가 있습니다.

 

Nginx 에러 페이지 수정해보기-1

 

에러 페이지에 한번 접속을 해보겠습니다. 

 

Nginx 에러 페이지 수정해보기-2

 

 

# 에러 파일이 있는 곳으로 이동해 줍니다. 
$ cd /usr/share/nginx/html

# "sudo"명령어를 통해 "50x.html" 파일을 열어줍니다.
$ sudo vi 50x.html

 

Nginx 에러 페이지 수정해보기-3
Nginx 에러 페이지 수정해보기-4

 

 

에러 페이지를 연 후에 입맛에 맞춰서 수정을 해줍니다. 

수정이 다 되었다면, 다시 한 번 에러페이지로 접속해 문구가 변경이 되었는지 확인을 해줍니다. 

 

Nginx 에러 페이지 수정해보기-5

 

 

3.Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기

이번엔 파일 안을 수정해 보는 것이 아니라 새로운 파일을 만들어서 그 파일로 변경해서 서버에 띄워보겠습니다.

 

# 파일을 만들 폴더로 이동을 해줍니다. 
$ cd /usr/share/nginx/html

# "hello.html" 파일을 만들어줍니다.
$ sudo vi hello.html

 

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -1

 

새로운 파일을 만들면 빈 페이지가 열립니다. 입력모드로 변경을 하여, 원하는 글자를 입력해 줍니다. 

 

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -2

 

 

이제 새로 만든 파일을 반영하기 위해서 "default.conf" 파일을 수정하러 가보겠습니다.

 

# "default.conf" 파일이 있는곳으로 이동을 해줍니다. 
$ cd /etc/nginx/conf.d

# "sudo" 명령어로 "default.conf" 파일을 열어줍니다. 
$ sudo vi default.conf

 

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -3

 

 

파일을 열고, 입력 모드로 전환을 한 뒤, 우리가 새롭게 만들었던, "hello.html"로 변경을 해줍니다. 

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -4

 

수정을 다 하고 나와서 설정 파일에 문법 에러가 없는지 한 번 체크해주는 명령어를 날려서 확인을 해줍니다. 

정상적이면 성공했다는 메시지가 함께 나옵니다. 

# Nginx 설정 파일 중 문법 에러가 있는 지 체크
$ sudo nginx -t

 

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -5

 

설정파일에 대한 변경으로 인해서 적용이 되게 명령어를 날려준다. 그러고 나서 다시 주소로 접속을 해보면!! 

"hello.html" 파일을 변경된 것을 확인할 수가 있습니다. 

# Nginx의 설정 파일이 바뀐 경우 아래 명령어를 입력해줘야 설정 파일이 반영된다.
$ sudo nginx -s reload

Nginx의 기본 웹 페이지를 Hello World 페이지로 바꿔보기 -6