私はいくつかのhtml/css/javascriptを学ぼうとしているので、私は自分自身で教育プロジェクトを書いています。
アイデアはいくつかの語彙をテーブルにロードするjsonファイルに含ませることでした。私はどうにかしてファイルをロードしてその値の1つをプリントアウトした後、値をテーブルにロードするコードを書き始めました。
それをした後、私はエラーになり始めたので、私は自分が書いたすべてのコードを削除し、1行だけを残しました(以前と同じ行です)...まだエラーだけが残っています。
エラーは以下のとおりです。
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
私のjavascriptコードは別のファイルに含まれていて、これは単にこれです:
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);
});
あなたはそれを2回構文解析しています。 get
はdataType='json'
を使用するので、データはjsonフォーマットの already です。返されたデータ型を明確に設定するために$.ajax({ dataType: 'json' ...
を使用してください!
基本的にレスポンスヘッダがtext/htmlの場合は解析する必要があり、レスポンスヘッダがapplication/jsonの場合はすでに解析されています。
text/htmlレスポンスのjquery成功ハンドラからの解析データ:
var parsed = JSON.parse(data);
アプリケーションのjquery成功ハンドラからの解析済みデータ/ json応答:
var parsed = data;
Unexpected token
エラーのためのもう一つのヒント。 javascriptオブジェクトと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
これは、JSONデータを返すメソッドにawait
キーワードの使用を忘れた場合にも発生します。
例えば:
async function returnJSONData()
{
return "{\"prop\": 2}";
}
var json_str = returnJSONData();
var json_obj = JSON.parse(json_str);
await
がないため、エラーがスローされます。実際に返されるのは、Promise
ではなく、string
[object]です。
修正するには、想定どおりにawaitを追加します。
var json_str = await returnJSONData();
これはかなり明白なはずですが、エラーはJSON.parse
で呼び出されるため、await
メソッド呼び出しとJSON.parse
の間に距離があると簡単に見逃してしまいます。コール。
JSONファイルの前後に末尾文字がないことを確認してください。たぶん印刷不可能なもの?あなたはこの方法を試してみたいかもしれません:
[{"english":"bag","kana":"kaban","kanji":"K"},{"english":"glasses","kana":"megane","kanji":"M"}]