JSON 오류 찾는 법과 보기 좋게 정리하기
API 응답을 확인하거나 설정 파일을 고치다 보면 "Unexpected token" 같은 JSON 오류를 자주 만나요. 한 줄로 길게 이어진 JSON은 눈으로 읽기도 어렵고요. JSON 문법 규칙 몇 가지만 알면 대부분의 오류는 금방 찾을 수 있어요.
JSON 기본 규칙
- 객체는
{ }, 배열은[ ]로 감싸요. - 키는 반드시 큰따옴표로 감싸요:
"name" - 문자열 값도 큰따옴표만 써요. 작은따옴표는 안 돼요.
- 값으로 쓸 수 있는 것은 문자열, 숫자,
true,false,null, 객체, 배열이에요. - 주석은 쓸 수 없어요.
가장 흔한 오류 다섯 가지
| 오류 | 잘못된 예 | 고친 예 |
|---|---|---|
| 끝 쉼표 | {"a": 1,} | {"a": 1} |
| 작은따옴표 | {'a': 'x'} | {"a": "x"} |
| 따옴표 없는 키 | {a: 1} | {"a": 1} |
| 빠진 쉼표 | {"a": 1 "b": 2} | {"a": 1, "b": 2} |
| 닫히지 않은 괄호 | {"list": [1, 2} | {"list": [1, 2]} |
자바스크립트 코드에서는 끝 쉼표와 작은따옴표가 허용되기 때문에, 코드에서 복사한 내용을 JSON 파일에 붙여 넣을 때 이 오류가 특히 많이 생겨요.
오류 위치를 빠르게 찾는 방법
- 아래 JSON 정리 도구에 내용을 붙여 넣어요.
- 문법이 틀렸다면 몇째 줄 몇째 칸인지와 원인을 알려 줘요.
- 표시된 위치 바로 앞을 먼저 보세요. 쉼표나 따옴표가 빠진 곳은 실제 오류보다 한 칸 앞에 있는 경우가 많아요.
- 고친 뒤 다시 정리하면 들여쓰기가 맞춰진 JSON이 나와요.
JSON 정리들여쓰기, 오류 위치, CSV 변환
바로 쓰기
보기 좋게 정리하기와 한 줄로 줄이기
- 정리(들여쓰기): 사람이 읽고 고치기 쉬워요. 2칸이나 4칸 들여쓰기를 고를 수 있어요.
- 한 줄 압축: 공백과 줄바꿈을 빼서 전송 크기를 줄여요. 설정값이나 요청 본문에 넣을 때 써요.
- 키 정렬: 키를 알파벳순으로 정렬하면 두 JSON을 비교할 때 차이를 찾기 쉬워요.
- 트리 보기: 깊게 중첩된 데이터에서 원하는 값을 찾을 때 편해요.
JSON과 CSV 서로 바꾸기
객체가 여러 개 들어 있는 배열이라면 CSV로 바꿔서 엑셀이나 구글 시트에서 열 수 있어요. 반대로 CSV를 JSON 배열로 바꿀 수도 있어요. 단, 객체 안에 또 배열이나 객체가 들어 있으면 한 칸에 문자열로 들어가요.
보안 측면에서도 안심
JSON에는 API 키나 사용자 정보가 들어 있는 경우가 많아요. 이 도구는 브라우저 안에서만 처리해서 붙여 넣은 내용이 서버로 전송되지 않아요.
JSON을 다룰 때 좋은 습관
설정 파일처럼 사람이 자주 고치는 JSON은 들여쓰기한 상태로 저장하고, 키 순서를 일정하게 유지하면 나중에 변경 내역을 비교하기 쉬워요. 큰 JSON에서 오류를 찾을 때는 의심되는 부분을 반으로 나눠 확인하는 것도 빠른 방법이에요. 숫자 앞에 0이 붙은 값(예: 007)이나 매우 큰 정수는 JSON에서 의도와 다르게 읽힐 수 있으니 문자열로 감싸 두는 게 안전해요.
이 글에 나온 도구
JSON 정리들여쓰기, 오류 위치, CSV 변환
바로 쓰기