Something went wrong...

#HTTP #502 #404 #web 

지난해 12월 14일, 유튜브가 약 2시간 동안 먹통이 되는 일이 벌어졌습니다. 유튜브뿐 아니라 Gmail, Google 드라이브 등 구글 계정 관련 서비스들이 줄줄이 접속 장애를 일으켰죠. 내부 스토리지(storage) 할당량 문제로 인증 시스템이 멈추면서 발생한 사고였는데요. 유튜브 오류 안내 페이지에 뜬 망치를 든 원숭이 그림이 세계적인 밈(meme)으로 떠오를 정도였으니, 잠깐 동안 벌어진 일이었지만 구글의 막강한 영향력을 다시 한 번 확인한 순간이었죠. 😰

이런 일은 비단 구글만 겪는 어려움은 아니에요. 학교나 학원에서 수강신청을 하거나, 한정 판매나 티켓 예매에 뛰어들 때 서버가 터졌다며 아우성치는 모습을 주변에서 종종 볼 수 있죠. 때마침 접속하려고 했던 사이트가 우연히 먹통이어서 곤란을 겪기도 하고요. 모니터에 502, 503 같은 숫자가 덩그러니 떠 있는 걸 보고 있자면 초조하고 화도 납니다. 한편으로는 궁금하기도 하죠. 도대체 왜 접속은 안 되면서 이런 숫자를 띄우는 걸까요? 

2월 둘째 주 <주간 인프런> 에서는 우리가 인터넷을 쓰면서 종종 마주하는 HTTP 상태 코드에 대해 다룹니다. 사이트 접속이 안 될 때마다 묵묵히 떠 있는 정체불명의 세 자리 숫자 코드! 이 코드가 각각 무슨 뜻인지, 왜 띄우는지 간단하게 알아보려고 해요. 그럼 함께 살펴볼까요? 👀

서버의 상태를 알려줘요, HTTP 상태 코드!

403 Forbidden, 404 Not Found, 502 Bad Gateway, 503 Service Unavailable... 인터넷을 사용하면서 한 번쯤 마주친 적 있는 문구죠? 이것들을 HTTP 상태 코드(HTTP Status Code)라고 불러요. 

상태 코드란 웹상에서 클라이언트가 서버로 요청을 보낼 때, 즉 특정한 웹 페이지에 접속하거나, 특정한 동작을 수행할 수 있게끔 버튼을 누르거나 값을 입력하는 등 서버로 요청을 보낼 때 그 요청이 잘 처리가 되었는지를 알려주는 기능이에요. 다시 말해 서버로 보낸 요청 상태를 나타내는 코드가 바로 상태 코드입니다. 서버로 보낼 작업의 수행 상태를 알려줄 수 있도록 표준에 맞춘 일종의 약속이죠. 이런 상태 코드를 사용하면 발생한 에러의 종류에 대해 커뮤니케이션하기에도 편리하고, HTTP 요청이 잘 이루어졌는지를 확인하기 좋으니까요.

HTTP 상태 코드는 1부터 5로 시작하는 세 자리 숫자 형태로 이루어져 있어요. 

이 세 자리 숫자 중에서 코드의 맨 앞자리 숫자(1~5)가 응답의 클래스를 결정하죠. 1부터 5까지, 맨 앞자리에 오는 다섯 개의 숫자는 각각 다음의 상태를 나타내요.

1xx (조건부 응답) 요청이 수신되어 프로세스를 계속한다
2xx (성공) 요청을 성공적으로 받아 처리했다 
3xx (리다이렉션) 요청을 마치기 위해 추가 행동이 필요하다
4xx (클라이언트 오류) 요청이 잘못되어 요청을 처리할 수 없다
5xx (서버 오류) 서버가 유효한 요청을 처리하는 데 실패했다

다시 말해 맨 앞자리 숫자가 같다면 해당 유형의 응답을 받는 상태 코드라는 뜻입니다. 만약 잘 모르는 코드를 반환받더라도, 1~5 중 어떤 숫자로 시작하는지를 알면 상위의 상태 코드로 해석하면 되고요. 

1xx에 해당하는 코드는 ‘요청을 처리하고 있다’는 뜻이기 때문에 최근 실무에서는 잘 쓰지 않는 코드입니다. 하지만 맨 앞자리가 2, 3, 4, 5로 시작하는 코드는 보다 자주 만나게 돼요. 예를 들어 요청을 성공적으로 받아 처리했을 경우에는 “200 OK”이 나타나고, 요청을 완료하기 위해 리다이렉션(Redirection* 클라이언트가 요청한 리소스에 더 이상 해당 주소로 접근할 수 없어 다른 주소를 통해 접근하도록 함) 이 이루어져야 할 때는 3xx 대역의 상태 코드를 볼 수 있겠죠.

평소 우리가 인터넷을 쓰다 마주하는 코드는 4나 5로 시작하는 것들이 많습니다. 서버가 뻗었다거나, 잘못된 주소를 입력했다거나, 이미 폐쇄되었거나 만료된 링크에 접속했을 때 말이죠. 즉 클라이언트 쪽에서 잘못된 요청을 보낸 경우(4xx), 요청은 제대로 보냈는데 서버가 요청을 처리하지 못해(5xx) 오류가 발생하는 경우가 여기에 해당하죠. 여러 서비스들이 상태 코드에 따라 오류가 발생하면 코드에 맞는 오류 화면(Error Page)를 출력해주게 됩니다. 수많은 코드가 있지만, 대표적인 것만 뽑아보자면 이 정도로 정리할 수 있겠네요. 

400 Bad Request (잘못된 요청)
잘못된 문법으로 인해 서버가 요청을 이해할 수 없는 경우.

403 Forbidden (거부됨)
클라이언트가 콘텐츠에 접근할 권리를 가지고 있지 않을 경우. 한 웹 서비스의 일반 유저가 어드민 페이지에 접속을 시도한다거나, 특정 IP나 국가가 차단되어 있는 사이트에 접속을 시도할 때 이를 거절하기 위한 응답.

404 Not Found (찾을 수 없음)
서버가 요청받은 리소스를 찾을 수 없는 경우. ‘서버를 찾을 수 없다’는 게 아니라, 서버와 통신은 되지만 요청한 바를 찾을 수 없다는 뜻.

500 Internal Server Error (내부 서버 에러)
서버가 처리 방법을 모르는 상황과 마주쳤지만, 서버가 처리 방법을 알 수 없을 경우. 서버에 오류가 발생해 작업을 수행할 수 없을 때 나타나는 코드.

502 Bad Gateway (불량 게이트웨이)
서버가 요청을 처리하는 데 필요한 응답을 얻기 위해 게이트웨이로 작업하는 동안 잘못된 응답을 받았다는 뜻.

503 Service Unavailable (일시적으로 이용할 수 없음)
서버가 요청을 처리할 준비가 되지 않았음. 보통은 유지보수를 위해 작동을 중단했거나 과부하 상태가 된 서버로 인해 발생하는 코드.

504 Gateway Timeout (게이트웨이 시간 초과)
게이트웨이가 연결된 서버로부터 응답을 적절한 시간 내에 받을 수 없었다는 뜻.

그럼, 인프런 에러 페이지는 어떨까요?

잘 감이 오지 않는다구요? 인프런에서도 문제가 발생할 경우 여러 상태 코드에 맞게 에러 페이지를 띄워주고 있어요. 2021년 2월 현재 인프런의 에러 페이지는 이렇게 생겼죠. 

사실 에러 페이지 화면을 이렇게 해둔 건 꽤 최근의 일이랍니다. (2020년 12월에 새로 단장했어요!) 인프런을 오랫동안 이용해오신 분들이라면 다음 화면도 친숙하실지 모르겠네요. 바로 고양이가 키보드를 열심히(!) 두드리는 애니메이션이 들어간 화면인데요.

그렇다면 이런 화면들은 언제 쓰이는 걸까요? 상태 코드에 따라 구분해볼 수도 있을까요? 물론 가능하고 말고요! 다음 이미지를 눈여겨봐주세요.

눈치채셨나요? 위의 UFO 에러 페이지가 전부 5xx 대역의 상태 코드, 즉 ‘서버 에러’가 발생할 때라는 사실을요. 반면, 고양이 페이지는 이런 경우에 나타납니다.

UFO 페이지의 경우에는 인프런 서버에 문제가 발생했을 때 나타나지만, 고양이 페이지는 서버에는 문제가 없는데 유저가 잘못된 요청을 시도했을 때 볼 수 있는 페이지예요. 즉 4xx 대역에 해당하는 ‘클라이언트 에러’가 발생할 때 고양이 페이지를 만날 수 있죠. 반면, 인프런 서버에 장애가 발생했거나 과부하가 걸린 경우에는 날아다니는 UFO를 볼 수 있게 되구요. 이제 클라이언트 에러와 서버 에러의 차이, ‘인프런 고양이’와 ‘인프런 UFO’의 차이를 아시겠죠?

고양이로 알아보는 재미있는 상태 코드

멀록은 워크래프트 시리즈, 하스스톤, 히어로즈 오브 더 스톰에 나오는 캐릭터예요. (아옳옳옳옳!)

이번 [주간 인프런] 어떠셨나요?
솔직한 의견을 들려주세요!

유익해요 | 아쉬워요

지난 [주간 인프런] 이 궁금하다면? (클릭)