API 응답을 확인하려고 콘솔에 출력했는데, JSON이 한 줄로 다닥다닥 붙어서 나왔다. 중괄호가 어디서 열리고 닫히는지 눈으로 추적하는 것부터가 고역이다. 데이터가 100줄이 넘으면 사실상 불가능하다.
JSON이 한 줄로 나오는 이유
서버는 네트워크 전송량을 줄이려고 JSON에서 공백과 줄바꿈을 전부 제거한 채로 보낸다. 이걸 minified JSON이라고 한다. 컴퓨터가 읽기엔 문제없지만, 사람이 읽으려면 들여쓰기가 필요하다.
보기 좋게 정리하는 방법
브라우저 콘솔에서 직접 정리할 수도 있다.
JSON.stringify(JSON.parse(data), null, 2)하지만 데이터가 길거나, JSON 파일 자체를 다루는 상황이라면 매번 콘솔을 여는 건 번거롭다. JSON 포맷터에 그대로 붙여넣으면 들여쓰기가 적용된 깔끔한 JSON이 바로 나온다. 들여쓰기를 2칸, 4칸, 탭 중에서 선택할 수 있고, 키를 알파벳순으로 정렬하는 옵션도 있다.
JSON 문법 오류 찾기
API를 개발하다 보면 JSON 파싱 에러가 종종 난다. 흔한 원인은 이렇다.
- 마지막 항목 뒤에 쉼표가 남아 있는 경우 (trailing comma)
- 문자열을 작은따옴표(
')로 감싼 경우 (JSON은 큰따옴표만 허용) - 키를 따옴표 없이 쓴 경우
- 값에
undefined나 주석(//)이 포함된 경우
에러 메시지만 보고는 정확한 위치를 찾기 어려운 경우가 많다. JSON 검증 기능을 쓰면 몇 번째 줄, 어떤 부분에서 문법이 틀렸는지 바로 짚어준다.
TIP JSON과 JavaScript 객체는 문법이 다르다. JavaScript에서는 키에 따옴표 없이 써도 되지만, JSON은 모든 키를 큰따옴표로 감싸야 한다. 이 차이를 모르면 파싱 에러가 반복된다.
JSON 압축은 언제 쓰나
정렬의 반대 작업도 필요한 순간이 있다. 설정 파일이나 API 요청 바디를 보낼 때, 불필요한 공백을 제거하면 데이터 크기가 줄어든다. 보기 좋게 정리된 JSON을 한 줄로 압축하면 전송 효율이 높아진다.
JSON은 읽을 때는 정렬해서, 보낼 때는 압축해서 쓴다. 이 구분만 기억해두면 상황에 맞게 쓸 수 있다.