Ubuntu 14.04에서 사용자 지정 오류 페이지를 사용하도록 Nginx를 구성하는 방법

소개

Nginx는 유연하고 강력하게 콘텐츠를 제공할 수 있는 고성능 웹 서버입니다. 웹 페이지를 디자인할 때 사용자에게 표시되는 모든 콘텐츠를 사용자 지정하는 것이 유용한 경우가 많습니다. 여기에는 사용할 수 없는 콘텐츠를 요청할 때의 오류 페이지가 포함됩니다. 이 가이드에서는 Ubuntu 14.04에서 사용자 지정 오류 페이지를 사용하도록 Nginx를 구성하는 방법을 보여줍니다.

전제 조건

이 가이드를 시작하려면 sudo 권한이 있는 루트가 아닌 사용자가 필요합니다. Ubuntu 14.04용 초기 설정 가이드를 따라 이 유형의 사용자를 설정할 수 있습니다.

또한 시스템에 Nginx가 설치되어 있어야 합니다. 이 가이드를 따라 설정하는 방법을 알아보세요.

위의 단계를 완료했으면 이 가이드를 계속 진행합니다.

사용자 지정 오류 페이지 만들기

데모 목적으로 몇 가지 사용자 정의 오류 페이지를 생성하지만 사용자 정의 페이지는 분명히 다를 것입니다.

Ubuntu의 Nginx가 기본 문서 루트를 설정하는 /usr/share/nginx/html 디렉토리에 사용자 정의 오류 페이지를 배치합니다. custom_404.html이라는 404 오류에 대한 페이지와 custom_50x.html이라는 일반 500 수준 오류에 대한 페이지를 만들 것입니다. 테스트만 하는 경우 다음 줄을 사용할 수 있습니다. 그렇지 않으면 다음 위치에 자신의 콘텐츠를 넣으십시오.

echo "<h1 style='color:red'>Error 404: Not found :-(</h1>" | sudo tee /usr/share/nginx/html/custom_404.html
echo "<p>I have no idea where that file is, sorry.  Are you sure you typed in the correct URL?</p>" | sudo tee -a /usr/share/nginx/html/custom_404.html
echo "<h1>Oops! Something went wrong...</h1>" | sudo tee /usr/share/nginx/html/custom_50x.html
echo "<p>We seem to be having some technical difficulties. Hang tight.</p>" | sudo tee -a /usr/share/nginx/html/custom_50x.html

이제 클라이언트 요청으로 인해 다른 오류가 발생할 때 제공할 수 있는 두 개의 사용자 지정 오류 페이지가 있습니다.

오류 페이지를 사용하도록 Nginx 구성

이제 올바른 오류 조건이 발생할 때마다 이러한 페이지를 활용해야 한다고 Nginx에 알리기만 하면 됩니다. 구성하려는 /etc/nginx/sites-enabled 디렉터리에서 서버 블록 파일을 엽니다. default라는 기본 서버 블록 파일을 사용하지만 기본 파일이 아닌 파일을 사용하는 경우 자체 서버 블록을 조정해야 합니다.

sudo nano /etc/nginx/sites-enabled/default

이제 Nginx가 사용자 지정 오류 페이지를 가리킬 수 있습니다.

404 오류를 사용자 지정 404 페이지로 안내

error_page 지시문을 사용하여 404 오류가 발생할 때(요청한 파일을 찾을 수 없는 경우) 생성한 사용자 지정 페이지가 제공되도록 합니다. 파일에 대한 위치 블록을 생성하여 루트가 파일 시스템 위치와 일치하고 내부 Nginx 리디렉션을 통해서만 파일에 액세스할 수 있는지(클라이언트가 직접 요청할 수 없음) 확인할 수 있습니다.

server {
        listen 80 default_server;
        listen [::]:80 default_server ipv6only=on;

        . . .

        error_page 404 /custom_404.html;
        location = /custom_404.html {
                root /usr/share/nginx/html;
                internal;
        }
}

일반적으로 서버 블록의 루트와 일치하므로 새 위치 블록에 루트를 설정할 필요가 없습니다. 그러나 일반 웹 콘텐츠 및 관련 문서 루트를 다른 위치로 이동하더라도 오류 페이지가 제공되도록 여기에서 명시적으로 설명합니다.

사용자 지정 50x 페이지에 500 수준 오류 지정

다음으로 Nginx에서 500 수준 오류(서버 관련 문제)가 발생할 때 우리가 만든 다른 사용자 지정 페이지를 제공하도록 지시문을 추가할 수 있습니다. 이것은 이전 섹션에서 사용한 것과 정확히 동일한 공식을 따릅니다. 이번에는 모두 custom_50x.html 페이지를 사용하도록 여러 500 수준 오류를 설정했습니다.

server {
        listen 80 default_server;
        listen [::]:80 default_server ipv6only=on;

        . . .

        error_page 404 /custom_404.html;
        location = /custom_404.html {
                root /usr/share/nginx/html;
                internal;
        }

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

        location /testing {
                fastcgi_pass unix:/does/not/exist;
        }
}

맨 아래에는 500 레벨 오류 페이지를 테스트할 수 있도록 더미 FastCGI 패스도 추가했습니다. 백엔드가 존재하지 않기 때문에 제대로 작동하지 않습니다. 여기에서 페이지를 요청하면 500 수준 오류가 사용자 지정 페이지에 제공되는지 테스트할 수 있습니다.

완료되면 파일을 저장하고 닫습니다.

Nginx 재시작 및 페이지 테스트

다음을 입력하여 구성 파일의 구문을 테스트합니다.

sudo nginx -t

오류가 보고된 경우 계속하기 전에 오류를 수정하십시오. 구문 오류가 반환되지 않으면 다음을 입력하여 Nginx를 다시 시작합니다.

sudo service nginx restart

이제 서버의 도메인 또는 IP 주소로 이동하여 존재하지 않는 파일을 요청하면 설정한 404 페이지가 표시됩니다.

http://server_domain_or_IP/thiswillerror

FastCGI 패스에 대해 설정한 위치로 이동하면 사용자 지정 500 수준 페이지와 함께 502 잘못된 게이트웨이 오류가 표시됩니다.

http://server_domain_or_IP/testing

이제 돌아가서 Nginx 구성에서 가짜 FastCGI 패스 위치를 제거할 수 있습니다.

결론

이제 사이트에 대한 사용자 지정 오류 페이지를 제공해야 합니다. 이것은 사용자가 문제를 겪고 있을 때에도 사용자 경험을 개인화할 수 있는 쉬운 방법입니다. 이러한 페이지에 대한 한 가지 제안은 도움이나 추가 정보를 얻기 위해 이동할 수 있는 위치에 대한 링크를 포함하는 것입니다. 이렇게 하면 연결된 오류가 발생하는 경우에도 링크 대상에 액세스할 수 있는지 확인하십시오.