API에서 받아온 응답이 한 줄짜리 JSON이다. 중괄호와 쉼표가 빼곡하게 이어져 있어서 어디가 어떤 값인지 눈으로 읽을 수가 없다. 디버깅하려면 우선 이걸 사람이 읽을 수 있는 형태로 정리해야 한다.
JSON이 읽기 어려운 이유
API 응답이나 로그에서 나오는 JSON은 대부분 공백과 줄바꿈이 제거된 압축 상태다. 네트워크 전송 속도를 위해 일부러 그렇게 만든 것이다.
{"name":"홍길동","age":30,"address":{"city":"서울","zip":"06000"},"tags":["개발","디자인"]}이걸 정렬(pretty print)하면 아래처럼 된다.
{
"name": "홍길동",
"age": 30,
"address": {
"city": "서울",
"zip": "06000"
},
"tags": [
"개발",
"디자인"
]
}구조가 보이니까 비로소 읽을 수 있다.
흔한 JSON 오류와 원인
JSON을 직접 수정하다 보면 사소한 실수 하나로 전체가 깨진다.
| 오류 메시지 | 원인 |
|---|---|
| Unexpected token | 쉼표 누락 또는 초과 |
| Unterminated string | 따옴표를 닫지 않음 |
| Expected property name | 키에 따옴표를 쓰지 않음 |
| Trailing comma | 마지막 항목 뒤에 불필요한 쉼표 |
주의 JSON에서 키(key)는 반드시 큰따옴표("")로 감싸야 한다. JavaScript 객체와 달리 작은따옴표나 따옴표 없는 키는 허용되지 않는다.
JSON 포맷터로 할 수 있는 것
- 정렬(Format): 압축된 JSON에 들여쓰기와 줄바꿈을 추가해서 읽기 쉽게 만든다
- 압축(Minify): 반대로 공백을 전부 제거해서 파일 크기를 줄인다
- 검증(Validate): 문법 오류가 있으면 위치와 원인을 알려준다
- 키 정렬(Sort Keys): 키를 알파벳순으로 정렬해서 두 JSON을 비교하기 쉽게 만든다
들여쓰기를 2칸으로 할지 4칸으로 할지 선택할 수 있는 온라인 JSON 포맷터에 붙여넣기만 하면 정렬, 압축, 검증이 한 화면에서 끝난다. 파일 크기, 키 개수, 중첩 깊이 같은 통계도 실시간으로 보여준다.
JSON 오류 잡는 데 가장 오래 걸리는 건 쉼표 하나 찾는 일이다. 자동 검증으로 위치를 바로 짚어주면 그 시간을 통째로 아낄 수 있다.