ฉันได้รับ“ Uncaught SyntaxError: Tokken ที่ไม่คาดคิด”

ฉันพยายามเรียนรู้ 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 (ไม่พบ)" ดังนั้นฉันรู้ว่ามันกำลังโหลด (หรืออย่างน้อยก็พยายาม)

ดูเหมือนว่า jQuery จะเดาเกี่ยวกับประเภทข้อมูล JSON แยกวิเคราะห์แม้ว่าคุณจะไม่ได้เรียกใช้ getJSON () - แต่เมื่อคุณพยายามโทรหา JSON.parse () บนวัตถุคุณได้รับข้อผิดพลาด

คำอธิบายเพิ่มเติมสามารถพบได้ในคำตอบของ Aditya Mittal

ปัญหาง่ายมาก

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

คุณกำลังแยกมันสองครั้ง getใช้dataType='json'เพื่อให้ข้อมูลเป็นอยู่แล้วในรูปแบบ JSON ใช้$.ajax({ dataType: 'json' ...เพื่อตั้งค่าชนิดข้อมูลที่ส่งคืนโดยเฉพาะ!

โดยทั่วไปถ้าส่วนหัวการตอบสนองเป็นข้อความ / html ที่คุณต้องแยกวิเคราะห์และถ้าส่วนหัวการตอบสนองเป็น application / json มันจะแยกวิเคราะห์แล้วสำหรับคุณ

วิเคราะห์ข้อมูลจาก jquery success handler สำหรับการตอบกลับ text / html:

var parsed = JSON.parse(data);

วิเคราะห์ข้อมูลจากตัวจัดการความสำเร็จ jquery สำหรับการตอบสนองของแอปพลิเคชัน / json:

var parsed = data;

คำแนะนำอื่นสำหรับUnexpected tokenข้อผิดพลาด มีความแตกต่างที่สำคัญระหว่างวัตถุ javascript และ 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ข้อผิดพลาด ดังนั้นอาจช่วยผู้อื่นที่กลั้นคำถามนี้

เพียงแค่การตอบสนองถูกแจงแล้วคุณไม่จำเป็นต้องแยกมันอีกครั้ง หากคุณแยกวิเคราะห์อีกครั้งจะให้ "โทเค็นที่ไม่คาดคิด" แต่คุณต้องระบุประเภทข้อมูลในคำขอของคุณให้เป็นประเภทdataType='json'

ฉันมีปัญหาที่คล้ายกันในตอนนี้และวิธีแก้ปัญหาของฉันอาจช่วยได้ ฉันใช้ iframe เพื่ออัปโหลดและแปลงไฟล์ xml เป็น json แล้วส่งกลับมาด้านหลังและ Chrome ก็เพิ่มขยะลงในข้อมูลขาเข้าที่จะปรากฏขึ้นเป็นระยะ ๆ เท่านั้นและทำให้เกิด "Uncaught SyntaxError: Token ที่ไม่คาดคิด" ความผิดพลาด

ฉันกำลังเข้าถึงข้อมูล iframe ดังนี้:

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

ซึ่งทำงานได้ดีบน localhost แต่เมื่อฉันอัปโหลดไปยังเซิร์ฟเวอร์มันหยุดทำงานกับไฟล์บางไฟล์เท่านั้นและเมื่อโหลดไฟล์ในลำดับที่แน่นอน ฉันไม่รู้จริงๆว่าเกิดจากอะไร แต่สิ่งนี้ทำให้มันคงที่ ฉันเปลี่ยนบรรทัดด้านบนเป็น

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

เมื่อฉันสังเกตเห็นขยะในการตอบสนอง HTML

เรื่องสั้น ๆ สั้น ๆ ตรวจสอบข้อมูลการตอบกลับ HTML แบบดิบของคุณและคุณอาจทำให้บางอย่างเกิดขึ้น

SyntaxError: Unexpected token o in JSON

สิ่งนี้จะเกิดขึ้นเมื่อคุณลืมใช้awaitคำสำคัญสำหรับวิธีที่ส่งคืนข้อมูล JSON

ตัวอย่างเช่น:

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

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

awaitจะโยนความผิดพลาดเนื่องจากการขาดหายไป สิ่งที่จะถูกส่งกลับจริงเป็นPromise[วัตถุ] stringไม่

ในการแก้ไขเพียงเพิ่มการรอตามที่คุณควรจะ:

var json_str = await returnJSONData();

นี่ควรจะค่อนข้างชัดเจน แต่ข้อผิดพลาดถูกเรียกใช้JSON.parseดังนั้นจึงเป็นเรื่องง่ายที่จะพลาดถ้ามีระยะห่างระหว่างawaitวิธีการโทรและการJSON.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: โทเค็นที่ไม่คาดคิด o ใน JSON ที่ตำแหน่ง 1 - สแต็คล้น"