JSON의 "Unexpected token in JSON" 및 일반적인 JSON 파싱 오류 해결 방법: 완전 가이드
JSON (JavaScript Object Notation)은 현대 웹 통신의 핵심입니다. REST API 구축, 서버 설정, 애플리케이션 상태 저장 등 JSON은 어디에나 있습니다. 하지만 엄격한 문법으로 인해 SyntaxError: Unexpected token, JSON.parse: unexpected character 또는 단순한 invalid JSON format과 같은 답답한 오류가 자주 발생합니다.
이 가이드에서는 가장 일반적인 JSON 파싱 오류를 분석하고, 왜 발생하는지 설명하며, 정확한 해결 방법을 보여드립니다.
1. 일반적인 JSON 오류 메시지
구문 분석기(JavaScript의 JSON.parse() 등)가 유효하지 않은 JSON을 만나면 오류를 발생시킵니다. 환경에 따라 다음과 같은 메시지가 표시될 수 있습니다.
- 브라우저 (Chrome/V8):
SyntaxError: Unexpected token ' in JSON at position 0 - Firefox:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data - Node.js:
SyntaxError: Unexpected token ... in JSON at position ... - Python:
json.decoder.JSONDecodeError: Expecting property name enclosed in double quotes
핵심 정보는 보통 예상치 못한 문자와 그것이 발생한 위치(또는 행/열)입니다.
2. 주요 원인 및 해결 방법
2.1 큰따옴표 대신 작은따옴표 사용
JSON은 키와 문자열 값 모두에 **큰따옴표(")**를 사용할 것을 엄격히 요구합니다. 작은따옴표(')는 JavaScript 객체에서는 유효하지만 JSON 문자열에서는 유효하지 않습니다.
오류 예시 (single quotes in JSON):
{
'name': 'Tool3M'
}
해결 방법: 모든 작은따옴표를 큰따옴표로 바꿉니다.
{
"name": "Tool3M"
}
2.2 후행 쉼표 (Trailing Commas)
현대 JavaScript와 달리 JSON은 객체나 배열의 마지막 항목 뒤에 쉼표를 허용하지 않습니다.
오류 예시 (trailing comma in JSON):
{
"id": 1,
"status": "active",
}
해결 방법: 마지막 속성 뒤의 쉼표를 제거합니다.
{
"id": 1,
"status": "active"
}
2.3 따옴표가 없는 키
JSON에서 키는 항상 큰따옴표로 묶인 문자열이어야 합니다.
오류 예시:
{
id: 123
}
해결 방법: 키를 큰따옴표로 감쌉니다.
{
"id": 123
}
2.4 JSON 내 주석
JSON 표준은 주석(// 또는 /* */)을 지원하지 않습니다 (comments in JSON). 일부 도구(tsconfig.json을 위한 VS Code 등)에서는 허용되지만, 표준 JSON.parse()는 실패합니다.
오류 예시:
{
"id": 1 // 이것은 주석입니다
}
해결 방법:
파싱하기 전에 모든 주석을 제거합니다. 메타데이터가 필요한 경우 "__comment": "text"와 같은 속성을 사용하세요.
2.5 특수 값: NaN, Infinity, Undefined
JSON은 NaN, Infinity, -Infinity, undefined를 지원하지 않습니다. 이들은 JavaScript 전용 값입니다.
오류 예시 (NaN in JSON, Infinity in JSON):
{
"value": NaN,
"expired": undefined
}
해결 방법:
대신 null이나 자리 표시자 문자열/숫자를 사용하세요.
{
"value": null,
"expired": null
}
2.6 제어 문자 및 줄바꿈
JSON의 문자열은 이스케이프되지 않은 원시 제어 문자(탭 또는 실제 줄바꿈 등)를 포함할 수 없습니다.
오류 예시:
{
"description": "이것은
여러 줄 문자열입니다"
}
해결 방법:
줄바꿈에는 \n, 탭에는 \t를 사용하세요.
{
"description": "이것은 \n여러 줄 문자열입니다"
}
3. 고급 문제 해결
3.1 BOM (Byte Order Mark)
파일이 완벽해 보이는데도 위치 0에서 SyntaxError가 발생하는 경우가 있습니다. 이는 종종 파일 시작 부분에 숨겨진 UTF-8 BOM 문자로 인해 발생합니다.
해결 방법: 파일을 "BOM 없는 UTF-8"로 다시 저장하세요.
3.2 잘못 이스케이프된 문자
문자열에 백슬래시(\)나 큰따옴표(")가 포함된 경우 이스케이프해야 합니다.
- 올바름:
"path": "C:\\Windows\\System32" - 올바름:
"quote": "그가 \"안녕하세요\"라고 말했다"
4. 예방 조치
- Linter 사용:
jsonc-parser가 포함된 ESLint나 VS Code의 기본 JSON 유효성 검사를 사용하세요. - 자동 서식 지정: 설정 파일에 저장하기 전에 항상 포맷터를 통해 JSON을 실행하세요.
- 스키마 검증: JSON Schema를 사용하여 데이터 구조를 정의하고 프로그래밍 방식으로 검증하세요.
- Try-Catch: 동적 데이터를 파싱할 때는 항상
JSON.parse()를try...catch블록으로 감싸 오류를 적절히 처리하세요.
try {
const data = JSON.parse(userInput);
} catch (e) {
console.error("JSON 파싱 실패:", e.message);
// 사용자에게 친숙한 오류 메시지 표시
}
5. FAQ: 자주 묻는 질문
Q: 왜 "Unexpected token < in JSON at position 0" 오류가 발생하나요?
A: 이는 거의 항상 코드가 JSON을 기대했지만 HTML을 받았음을 의미합니다. 일반적으로 API 호출이 실패하고 서버가 예상된 JSON 응답 대신 HTML 오류 페이지(404 또는 500 페이지 등)를 반환할 때 발생합니다.
Q: JSON에서 16진수를 사용할 수 있나요?
A: 아니요. JSON은 표준 10진수만 지원합니다. 0xFF는 파싱 오류(JSON parse error)를 유발합니다. 대신 255를 사용하세요.
Q: 파서를 중단시키는 대용량 JSON 파일은 어떻게 처리하나요?
A: 매우 큰 파일의 경우, 파일을 메모리에 모두 로드하는 대신 조각별로 처리하는 JSONStream(Node.js) 또는 ijson(Python)과 같은 "스트リーミング" 파서를 사용하세요.
6. 빠른 확인 도구
누락된 쉼표나 잘못된 따옴표를 찾는 데 어려움을 겪고 있다면 당사의 **JSON 포맷터 및 검증기**를 사용해 보세요.
- 구문 오류를 즉시 강조 표시합니다.
- 작은따옴표나 후행 쉼표와 같은 일반적인 문제를 수정합니다.
- JSON을 포맷하여 사람이 읽기 쉽게 만듭니다.
관련 오류
- 'invalid base64 string' 오류 해결
- JavaScript에서 'malformed URL'을 수정하는 방법
- YAML 들여쓰기 오류 이해하기