ERROR - 업데이트 2026-06-04
JSON Unexpected token 오류
JSON Unexpected token 오류가 나는 이유와 오류 위치, 따옴표, 쉼표, 실제 API 응답을 순서대로 확인하는 방법.
JSON 포맷터 & 오류 검사기 열기JSON Unexpected token 오류는 JSON 파서가 예상하지 못한 문자를 만났다는 뜻입니다. 대부분 따옴표, 쉼표, 중괄호, 대괄호, 또는 JSON이 아닌 응답을 JSON으로 파싱할 때 발생합니다. 먼저 오류 메시지의 token과 position을 확인하고, 그 위치 주변의 실제 문자열을 보는 것이 가장 빠릅니다.
증상
- 브라우저 콘솔에
Unexpected token ... in JSON at position ...가 표시됩니다. JSON.parse()를 호출하는 줄에서 예외가 납니다.- API 호출은 성공한 것처럼 보이지만 응답 파싱 단계에서 실패합니다.
- 로컬 예제는 되는데 실제 서버 응답에서만 오류가 납니다.
원인
JSON은 문법이 엄격합니다. JavaScript 객체처럼 보이지만 완전히 같지는 않습니다. 키는 반드시 큰따옴표로 감싸야 하고, 문자열도 큰따옴표를 써야 하며, 마지막 항목 뒤에 trailing comma를 둘 수 없습니다.
| 오류 형태 | 흔한 원인 | 먼저 볼 곳 |
|---|---|---|
Unexpected token } | 쉼표 위치가 잘못됐거나 값이 빠짐 | 오류 position 앞뒤 |
| `Unexpected token '`` | 작은따옴표 사용 | 문자열과 키 따옴표 |
Unexpected token o | 이미 객체인 값을 다시 JSON.parse() | 파싱 대상 타입 |
Unexpected token < | HTML 응답을 JSON으로 파싱 | status code와 응답 첫 글자 |
바로 해결 방법
- 오류 메시지의 token과 position을 복사합니다.
- 실제 파싱한 문자열을 JSON Error Doctor에 붙여넣습니다.
- 오류 위치 주변의 따옴표, 쉼표, 괄호 짝을 확인합니다.
- API 응답이면 Network 탭에서 status code, Content-Type, response body를 확인합니다.
- 파싱 대상이 문자열인지, 이미 객체인지 확인합니다.
오류 메시지별 빠른 해석
| 메시지 예 | 의미 | 먼저 볼 곳 |
|---|---|---|
Unexpected token < | JSON 대신 HTML을 받았을 가능성 | 응답 첫 글자, status code, Content-Type |
Unexpected token o | 객체를 다시 JSON.parse()했을 가능성 | 파싱 대상 타입 |
Unexpected token } | 값 누락 또는 trailing comma 가능성 | 닫는 괄호 직전 |
Unexpected end of JSON input | 응답이 비었거나 중간에 끊김 | 응답 길이, 네트워크 오류, 서버 로그 |
Bad control character | 문자열 안 줄바꿈/제어문자 문제 | 따옴표 안 원문 |
오류 메시지는 원인 그 자체라기보다 어디를 먼저 봐야 하는지 알려주는 힌트입니다. 문법 오류를 고치기 전에 실제로 파싱한 값이 무엇인지 확인해야 같은 문제를 반복하지 않습니다.
FixData 도구로 확인하기
JSON Error Doctor는 JSON 문자열을 검사하고 오류 위치와 대표 원인을 보여줍니다. 정상 JSON이면 pretty format 또는 minify로 정리할 수 있어, 문제가 문법인지 응답 타입인지 나누어 보기 쉽습니다.
API 디버깅 중이라면 콘솔에 찍은 객체가 아니라 Network 탭의 실제 response body를 복사해서 확인하세요. 콘솔 출력은 브라우저가 보기 좋게 바꿔 보여줄 수 있습니다.
수동 해결 방법
오류 위치 보기
오류 메시지에 position 57처럼 숫자가 나오면 그 인덱스 근처를 확인합니다. 한 줄 JSON이라면 pretty format을 먼저 시도하기보다 원본 문자열에서 해당 위치를 보는 편이 원인을 빨리 찾을 때가 많습니다.
JSON과 JavaScript 객체 구분하기
아래는 JavaScript 객체로는 가능하지만 JSON으로는 올바르지 않습니다.
{
name: 'Alice',
}
JSON으로는 다음처럼 작성해야 합니다.
{
"name": "Alice"
}
이미 객체인 값 확인하기
fetch().then((res) => res.json())로 받은 값은 이미 객체입니다. 이 값을 다시 JSON.parse(data)로 파싱하면 Unexpected token o 같은 오류가 날 수 있습니다.
예제
잘못된 JSON:
{
"name": "Alice",
"role": "admin",
}
수정한 JSON:
{
"name": "Alice",
"role": "admin"
}
마지막 항목 뒤 쉼표 때문에 Unexpected token }가 날 수 있습니다.
자주 하는 실수
- 콘솔에 보이는 객체를 그대로 JSON이라고 생각합니다.
- API가 실패했는데도 응답 본문을 확인하지 않고 JSON 문법만 고칩니다.
- 이미 객체인 값을 다시
JSON.parse()합니다. - 오류 position을 보지 않고 전체 파일을 눈으로만 훑습니다.
- pretty print된 화면만 보고 실제 원본 문자열의 따옴표와 줄바꿈을 확인하지 않습니다.
실무 FAQ
Unexpected token o는 왜 자주 나오나요?
이미 JavaScript 객체인 값을 다시 JSON.parse()할 때 자주 나옵니다. fetch().then((res) => res.json()) 결과는 문자열이 아니라 객체이므로, 다시 파싱하지 말고 그대로 사용해야 합니다.
오류 위치가 맞지 않는 것처럼 보이면 어떻게 확인하나요?
pretty format된 화면이 아니라 실제 파싱한 원본 문자열 기준으로 위치를 봐야 합니다. 줄바꿈, 이스케이프 문자, 앞쪽 공백 때문에 사람이 보는 줄 번호와 parser의 position이 다르게 느껴질 수 있습니다.
관련 도구
- JSON Error Doctor: JSON 오류 위치와 원인 후보를 빠르게 확인할 수 있습니다.
관련 글
- JSON / API Error Center
- Unexpected token < in JSON at position 0
- JSON trailing comma 오류
- JSON unexpected end of input
- JSON validate와 format의 차이
업데이트 날짜
2026-06-04