Treejin's Note

클라이언트와 서버간의 응답 형식에 대한 규약을 명확히 하고, 해당 형식에 맞게 dataType을 지정해주자!

회사 프로젝트 기존 코드를 유지보수 하던 도중,
POST API를 호출하고 정상적으로 저장되면서 201 status로 상태코드도 성공했다고 응답이 왔는데
자꾸 프론트엔드 코드에서는 fail 콜백 함수가 호출되고 그 내부에서 처리되는 현상이 발생했다.
도대체 200대의 성공 상태코드가 오는데 왜 fail이 호출되는거지?

열심히 구글링을 해본 결과 나와 같은 문제를 겪은 스택오버플로우 글을 발견했다.

즉, 응답에 빈 구문이 오는데 JSON으로 파싱하려고 시도하다가 안되니 fail 콜백이 호출되었다는 말이다.

나의 경우에도 이 경우와 동일하게 응답으로는 빈 구문을 받았는데, dataType을 지정해주지 않아서 fail 콜백이 호출되었다.

DataType이란?

api를 호출할 때 일반적으로 다음과 같은 형태로 호출하는데

$.ajax({
      type: 'POST',
      url: url,
      data: data,
      success: success,
      dataType: dataType
});

이 때 서버로부터 어떤 타입을 받을 것인지를 나타내는 속성이 dataType이다.

dataType은 'text', 'json', 'xml' 등 MIME 타입을 지정할 수 있고

선택적인 옵션이기 때문에 지정하지 않았을 경우 jQuery가 자동으로 결정한다.

• xml - XML문서
• html - HTML DOM형태
• script - JavaScript코드
• json - JSON형식 데이터로 평가. JavaScript의 개체로 변환합니다.
• text - 일반 텍스트

MIME타입 참고

이를 알고 dataType을 text로 지정해주었더니 done() 콜백 함수가 정상적으로 호출되었다.

POST API의 응답은 서버에 따라 선택적으로 body를 담아줄 수도 있고 빈 구문이 올 수도 있다.

서버와의 규약을 확실히 하고 정확한 dataType을 지정해 주는 것이 안정적으로 API 요청을 수행하는 방법이다.