brunch

You can make anything
by writing

C.S.Lewis

by 이지원 Feb 03. 2024

Axios에서 상태 코드를 커스텀 하게 처리하는 방법

안녕하세요, 백엔드 개발자와 PD 그리고 PM으로 구성된 에이슬립 플랫폼 서버팀에서 웹 대시보드와 서버 그리고 모바일 SDK 품질을 담당 중인 지원입니다.


빠르게 성장하는 팀의 품질 체계를 잡아가는 과정에서 릴리스 속도와 높은 품질의 균형을 잃지 않도록 안심하고 배포할 수 있는 웹 모바일 API 검증 시스템 구축에 집중하고 있는 요즘인데요, API 검증 시스템을 고도화 시키는 과정에서 알게 된 Axios의 validateStatus 옵션에 대해 소개합니다.


Axios란?

Axios는 HTTP 클라이언트 라이브러리로 서버와의 통신에서 자주 사용됩니다. Axios에서는 validateStatus 옵션을 제공하여 서버로부터 받은 상태 코드를 사용자 정의로 처리할 수 있습니다. 이번 글에서는 validateStatus를 사용하여 상태 코드를 어떻게 커스텀 하게 처리하는지 알아보겠습니다.


Axios의 validateStatus 옵션이란?

Axios의 Request Config를 살펴보면 HTTP 요청을 보낸 후 서버로부터 받은 상태 코드를 기본적으로 200에서 299 사이의 코드를 성공으로 처리하고, 그 외의 코드는 실패로 처리합니다. 그러나 사용자는 validateStatus를 설정하여 테스트 요구사항에 맞춰 보다 유연하게 처리할 수 있습니다.


validateStatus를 명시하지 않는 경우

설계 구조를 살펴보면 API 클래스에서 각 테스트 시나리오에 공통적으로 사용하는 GET POST PUT PATCH DELETE 요청에 대한 공통 메서드를 관리하고 있습니다. 그리고 Required Header Parameters 객체의 불변성(Immutability)을 유지하기 위해 생성자 함수(Constructor)가 호출될 때 전달된 매개변수들을 사용하여 Header 객체를 생성하고 있습니다.


위 코드의 get 메서드를 살펴보면 validateStatus를 명시하지 않고 있는데요.


Axios는 기본적으로는 200에서 299 사이의 상태 코드를 성공으로 처리하기 때문에 특별한 설정 없이도 이 범위 내의 상태 코드를 기본적으로 성공으로 처리합니다.

Step 파일의 테스트 시나리오가 만약 위와 같이 구현되어 있고, Feature 파일에 상태 코드 “200” 응답 확인에 대한 Then 코드가 정의되어 있다면 해당 테스트 시나리오는 모두 성공 처리됩니다.


하지만 만약에 잘못된 GET 요청이 진행된 상태에서 200 OK를 확인하려고 하면 어떻게 될까요?

Feature 파일에 작성된 Then 코드의 statusCode와 관계없이 Axios의 validateStatus Default 동작으로 인해 Error: Request failed with status code 400 에러가 발생합니다.


이렇듯 validateStatus를 명시하지 않을 경우엔 200에서 299 사이의 코드를 성공으로 처리하지만 그 외의 코드는 Then 단계에 작성된 검증 코드는 무시하고 반드시 실패로 처리합니다.


validateStatus를 false로 명시하는 경우

validateStatus를 false로 설정하면 axios는 모든 요청을 성공으로 처리합니다. validateStatus를 false로 설정 후 동일한 테스트 시나리오를 실행하면 어떻게 될까요?

Feature 파일에 작성된 Then 코드의 statusCode와 비교하므로 AssertionError [ERR_ASSERTION]: 400 == ‘200’ 에러가 발생합니다.


만약 테스트 요구사항 중에서 상태 코드가 400일 경우 성공 처리가 되어야 한다면 validateStatus를 false로 설정하여 해당 요구사항에 적합한 검증 코드를 구현할 수 있습니다.

RUNNING API TEST 로그에서 undefined이 출력된 이유는 When 단계에서 실제로 존재하지 않는 Path Parameter로 GET 요청을 보냈기 때문인데요. 만약 validateStatus를 명시하지 않았다면 Then 검증 로직과 관계없이 AssertionError가 아니라 Error: Request failed with status code 400 에러가 발생합니다.


이렇듯 validateStatus를 false로 설정하면 axios는 모든 요청을 성공으로 처리합니다. 위 시나리오에서 Then 검증 로직을 400이 아닌 401로 하면 Error: Request failed with status code 400 에러가 아닌 Then 검증 로직에 존재하는 statusCode와 비교하여 최종적으로 AssertionError [ERR_ASSERTION]: 400 == ‘401’ 에러가 발생합니다.


validateStatus를 함수로 직접 명시하는 경우

validateStatus를 함수로 명시하면 사용자는 원하는 상태 코드를 성공 또는 실패로 처리할 수 있습니다. 특정 범위의 상태 코드를 거부하거나 사용자 정의 로직을 적용할 수 있습니다.

위와 같이 200에서 500 미만의 상태 코드에 대한 요청만 성공으로 허용할 경우 Then 상태 코드 “400” 응답 확인 테스트 코드는 성공하게 됩니다. 만약 “200” 응답 확인이라면 실제로 존재하지 않는 Path Parameter로 GET 요청을 보냈기 때문에 400 에러가 발생하므로 AssertionError [ERR_ASSERTION]: 400 == ‘200’ 에러가 발생합니다.


만약 허용 범위가 아닌 상태 코드가 발견되면 validateStatus을 명시하지 않은 경우와 마찬가지로 위 테스트 시나리오에서는 Error: Request failed with status code 400 에러가 발생합니다.


마무리

지금까지 Axios에서 서버로부터 받은 상태 코드를 커스텀 하게 처리하는 방법 3가지에 대해 알아보았습니다.


validateStatus를 사용하면 서버로부터 받은 상태 코드를 자유롭게 처리할 수 있습니다. 테스트 요구사항에 적절한 설정을 통해 응답 코드를 세밀하게 제어하고 서버와의 통신에서 더욱 효율적으로 요청을 처리한다면 보다 유연한 구조의 검증 시스템이 갖춰질 수 있습니다.


감사합니다.

매거진의 이전글 데이터 정합성을 검증하고 재현 반복 가능하게 구성하기
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari