"Catch Untaxed SyntaxError : Unexpected token o"가 계속 나타납니다.

html / css / javascript를 배우려고 노력 중이므로 교육 프로젝트를 직접 작성하고 있습니다.

아이디어는 json 파일에 일부 어휘를 포함시킨 다음 테이블에로드하는 것입니다. 파일을로드하고 그 값 중 하나를 인쇄 한 후 값을 테이블에로드하는 코드를 작성하기 시작했습니다.

그렇게 한 후에 오류가 발생하기 시작하여 작성한 모든 코드를 제거하여 한 줄만 남겨 두었습니다 (이전에는 작동했던 것과 동일한 줄) ... 오류 만 남아 있습니다.

오류는 다음과 같습니다.

Uncaught SyntaxError: Unexpected token o
(anonymous function)script.js:10
jQuery.Callbacks.firejquery-1.7.js:1064
jQuery.Callbacks.self.fireWithjquery-1.7.js:1182
donejquery-1.7.js:7454
jQuery.ajaxTransport.send.callback

내 자바 스크립트 코드는 별도의 파일에 포함되어 있으며 간단히 다음과 같습니다.

function loadPageIntoDiv(){
    document.getElementById("wokabWeeks").style.display = "block";
}

function loadWokab(){
    //also tried getJSON which threw the same error
    jQuery.get('wokab.json', function(data) {
        var glacier = JSON.parse(data);
    });
}

그리고 내 JSON 파일에는 다음이 있습니다.

[
    {
        "english": "bag",
        "kana": "kaban",
        "kanji": "K"
    },

    {
        "english": "glasses",
        "kana": "megane",
        "kanji": "M"
    }
]

이제 11 행에 오류가보고됩니다 var glacier = JSON.parse(data);.

json 파일을 제거하면 "GET http : //.../wokab.json 404 (Not Found)" 오류가 발생하여 로드 중이거나 적어도 시도하고 있음을 알았습니다.

jQuery가 데이터 유형에 대해 추측하는 것처럼 보입니다. getJSON ()을 호출하지 않더라도 JSON 구문 분석을 수행합니다. 그런 다음 객체에서 JSON.parse ()를 호출하려고하면 오류가 발생합니다.

자세한 설명은 Aditya Mittal의 답변 에서 찾을 수 있습니다 .

문제는 매우 간단합니다

jQuery.get('wokab.json', function(data) {
    var glacier = JSON.parse(data);
});

당신은 그것을 두 번 파싱하고 있습니다. get를 사용 dataType='json'하므로 데이터는 이미 json 형식입니다. $.ajax({ dataType: 'json' ...리턴 된 데이터 유형을 구체적으로 설정하는 데 사용하십시오 !

기본적으로 응답 헤더가 text / html 인 경우 구문 분석해야하며 응답 헤더가 application / json 인 경우 이미 구문 분석되었습니다.

텍스트 / html 응답을 위해 jquery 성공 핸들러에서 구문 분석 된 데이터 :

var parsed = JSON.parse(data);

애플리케이션 / json 응답을 위해 jquery 성공 핸들러에서 구문 분석 된 데이터 :

var parsed = data;

Unexpected token오류에 대한 또 다른 힌트 . 자바 스크립트 객체와 json 사이에는 두 가지 주요 차이점이 있습니다.

1. json 데이터는 항상 큰 따옴표로 인용해야합니다.
2. 키를 인용해야합니다

올바른 JSON

 {
    "english": "bag",
    "kana": "kaban",
    "kanji": "K"
}

오류 JSON 1

 {
    'english': 'bag',
    'kana': 'kaban',
    'kanji': 'K'
 }

오류 JSON 2

 {
    english: "bag",
    kana: "kaban",
    kanji: "K"
}

말

이것은 그 질문에 대한 직접적인 대답이 아닙니다. 그러나 Unexpected token오류에 대한 답입니다 . 따라서 그 질문에 걸려 넘어지는 사람들을 도울 수 있습니다.

응답이 이미 파싱되었으므로 다시 파싱 할 필요가 없습니다. 다시 구문 분석하면 "예기치 않은 토큰 o"가 표시되지만 요청에서 데이터 유형을 유형으로 지정해야합니다.dataType='json'

지금 막 비슷한 문제가 있었고 해결책이 도움이 될 수 있습니다. iframe을 사용하여 xml 파일을 json으로 업로드하고 변환하여 장면 뒤에서 다시 전송하고 있으며 Chrome에서 수신 데이터에 간헐적으로 표시되는 일부 가비지를 추가하여 "Uncaught SyntaxError : Unexpected token o" 오류.

다음과 같이 iframe 데이터에 액세스했습니다.

$('#load-file-iframe').contents().text()

localhost에서 제대로 작동했지만 서버에 업로드 할 때 일부 파일 만 사용하고 특정 순서로 파일을로드 할 때만 작동하지 않았습니다. 실제로 원인을 알지 못했지만이 문제가 해결되었습니다. 위의 줄을

$('#load-file-iframe').contents().find('body').text()

일단 HTML 응답에서 약간의 쓰레기를 발견했습니다.

긴 이야기는 원시 HTML 응답 데이터를 짧게 확인하면 무언가를 향상시킬 수 있습니다.

SyntaxError: Unexpected token o in JSON

awaitJSON 데이터를 반환하는 메서드에 키워드 를 사용하는 것을 잊었을 때도 마찬가지 입니다.

예를 들면 다음과 같습니다.

async function returnJSONData()
{
   return "{\"prop\": 2}";
}

var json_str = returnJSONData();
var json_obj = JSON.parse(json_str);

누락으로 인해 오류가 발생합니다 await. 실제로 반환되는 것은 a가 아닌 Promise[object] string입니다.

수정하려면 다음을 기다려야합니다.

var json_str = await returnJSONData();

이것은 분명하지만 오류는에 호출 JSON.parse되므로 메소드 호출과 호출 사이에 거리 가 있으면 놓치기 쉽습니다 .awaitJSON.parse

JSON 파일에 전후에 후행 문자가 없는지 확인하십시오. 인쇄 할 수없는 것일 수도 있습니다. 이 방법으로 시도해 볼 수 있습니다.

[{"english":"bag","kana":"kaban","kanji":"K"},{"english":"glasses","kana":"megane","kanji":"M"}]

const getCircularReplacer = () => {
              const seen = new WeakSet();
              return (key, value) => {
                if (typeof value === "object" && value !== null) {
                  if (seen.has(value)) {
                    return;
                  }
                  seen.add(value);
                }
                return value;
              };
            };
JSON.stringify(tempActivity, getCircularReplacer());

tempActivity가 "SyntaxError : JSON의 예기치 않은 토큰 o 위치 1 위치에 오류가 발생합니다."