ហេតុអ្វី JSON.parse និយាយ "Unexpected token"?

នេះជាការដោះស្រាយ Unexpected token នៃ JSON.parse: កំហុសមានន័យដូចម្តេច របៀបអានទីតាំង និងអ្វីត្រូវធ្វើពេលរូបកាយជា HTML។ ការគ្របដណ្តប់ទូលំទូលាយអំពីសញ្ញាក្បៀសចុងក្រោយ សញ្ញាសម្រង់ និង Unexpected end ស្ថិតនៅ កំហុស JSON ធម្មតា: សញ្ញាក្បៀសចុងក្រោយ សញ្ញាសម្រង់ និង Unexpected token។

“Unexpected token” ក្នុង JSON.parse() មានន័យដូចម្តេច?

JSON.parse() ត្រូវការវេយ្យាករណ៍ JSON។ តួអក្សរមិនស្របច្បាប់នៅទីតាំងបច្ចុប្បន្នបោះ SyntaxError។ {“name”:“Alex”,} មិនត្រឹមត្រូវ: បន្ទាប់ពីសញ្ញាក្បៀសនោះវត្ថុមិនអាចបញ្ចប់។ អត្ថបទសារ និងទីតាំងនៅតែខុសគ្នាតាមពេលដំណើរការ។

JSON.parse() បោះកំហុសអ្វី?

JSON មិនត្រឹមត្រូវជាទូទៅបោះ SyntaxError។ កត់ត្រា error.name ដើម្បីបញ្ជាក់ប្រភេទ។ កុំសរសេរ error.message ពេញរឹង: ម៉ាស៊ីន និងកំណែប្រើពាក្យខុសគ្នា។

try {
  JSON.parse('{"name":"Alex",}');
} catch (error) {
  console.log(error.name);
  // SyntaxError
}

១. ប្រើសញ្ញាសម្រង់តែមួយជំនួសសញ្ញាសម្រង់ពីរ

{‘name’:‘Alex’} ជា JSON មិនត្រឹមត្រូវ។ {“name”:“Alex”} ត្រឹមត្រូវ។ ខ្សែអក្សរ JSON និងឈ្មោះសមាជិកវត្ថុប្រើសញ្ញាសម្រង់ពីរ។ លីតេរ៉ាល់វត្ថុ JavaScript ដូច const user = { name: ‘Alex’ } អាចជា JavaScript ស្របច្បាប់ ប៉ុន្តែនៅតែមិនមែនអត្ថបទ JSON។

មិនត្រឹមត្រូវ

{'name':'Alex'}

ត្រឹមត្រូវ

{"name":"Alex"}

២. សញ្ញាក្បៀសចុងក្រោយ

សញ្ញាក្បៀសបន្ទាប់ពីលក្ខណៈ ឬធាតុអារេចុងក្រោយមិនមែន JSON ស្តង់ដារត្រឹមត្រូវ។ {“name”:“Alex”,“age”:30,} និង [1, 2, 3,] ទាំងពីរបរាជ័យ។ ចាត់ទុកនេះជាមូលហេតុ Unexpected token មួយ; កំហុស JSON ធម្មតា: សញ្ញាក្បៀសចុងក្រោយ សញ្ញាសម្រង់ និង Unexpected token គ្របដណ្តប់សញ្ញាក្បៀសចុងក្រោយកាន់តែស៊ីជម្រៅ។

មិនត្រឹមត្រូវ

{
  "name": "Alex",
  "age": 30,
}

ត្រឹមត្រូវ

{
  "name": "Alex",
  "age": 30
}

[1, 2, 3,]

៣. ឈ្មោះលក្ខណៈគ្មានសញ្ញាសម្រង់

{ name: “Alex” } អាចជាលីតេរ៉ាល់វត្ថុ JavaScript។ ក្នុង JSON ឈ្មោះសមាជិកជាខ្សែអក្សរ និងត្រូវការសញ្ញាសម្រង់ពីរ: {“name”:“Alex”}។

មិនត្រឹមត្រូវ

{
  name: "Alex"
}

ត្រឹមត្រូវ

{
  "name": "Alex"
}

៤. Escape ខ្សែអក្សរមិនត្រឹមត្រូវ

ក្នុងអត្ថបទ JSON សញ្ញាទ្រេតក្រោយចាប់ផ្តើម escape។ ផ្លូវដើមដូច C:\Users\Alex មិនត្រឹមត្រូវ ព្រោះ \U មិនមែន escape ស្របច្បាប់។ ធ្វើសញ្ញាទ្រេតក្រោយពីរដង។ កុំលាយ escape ភាសាម៉ាស៊ីនផ្ទុកជាមួយ escape JSON។ កំហុស JSON ធម្មតា: សញ្ញាក្បៀសចុងក្រោយ សញ្ញាសម្រង់ និង Unexpected token គ្របដណ្តប់នេះកាន់តែស៊ីជម្រៅ។

មិនត្រឹមត្រូវ

{"file":"C:\Users\Alex"}

ត្រឹមត្រូវ

{"file":"C:\\Users\\Alex"}

៥. អត្ថបទបន្ថែមមុន ឬក្រោយ JSON

JSON.parse រំពឹងតម្លៃ JSON មួយ។ បុព្វបទដូច Success: មុន {“ok”:true} ឬបច្ឆិមបទដូច done ក្រោយវា ធ្វើឲ្យខ្សែអក្សរទាំងមូលមិនត្រឹមត្រូវ។ ចន្លោះសំខាន់តិចតួចជុំវិញតម្លៃ JSON តែមួយត្រូវបានអនុញ្ញាត។ JSON មិនត្រូវហាមឃាត់មិនឲ្យមានចន្លោះមុន ឬក្រោយតម្លៃទេ។

Success:
{"ok":true}

{"ok":true}
done

៦. ញែក HTML ជំនួស JSON

ហៅ response.json() លើទំព័រ HTML ជាករណី Unexpected token ធម្មតា។ Endpoint ខុស ទំព័រ HTML 404 ឬ 500 ការបញ្ជូនចូល រូបកាយប្រូកស៊ី និងទំព័រជំនួសច្រើនតែចាប់ផ្តើមដោយសញ្ញាសម្គាល់។ “Unexpected token < តែងតែមានន័យថា HTML” ខ្លាំងពេក: < ជាសញ្ញា មិនមែនភស្តុតាង។

fetch('/api/data')
  .then(response => response.json())

“Unexpected token <” ជាធម្មតាមានន័យដូចម្តេច?

តម្លៃ JSON ជាធម្មតាមិនចាប់ផ្តើមដោយ <។ បើរូបកាយចាប់ផ្តើមដោយ ឬ < អាចជាតួអក្សរមិនស្របច្បាប់ដំបូង។ ក្នុងការបំបាត់កំហុសមូលដ្ឋាន ពិនិត្យស្ថានភាព HTTP, Content-Type និងរូបកាយដើម។ ពាក្យម៉ាស៊ីននៅតែខុសគ្នា។

ពិនិត្យចម្លើយមុនញែក

រូបកាយ fetch អាចប្រើបានតែម្តង។ ក្នុងការបំបាត់កំហុសមូលដ្ឋាន អាន text() មុន ពិនិត្យបុព្វបទខ្លី បន្ទាប់មក JSON.parse ខ្សែអក្សរដដែល។ កុំហៅ response.json() បន្ទាប់មក response.text() លើចម្លើយដដែល។ កុំកត់ត្រាបន្ទុកផលិតកម្មរសើបតាមលំនាំដើម។

const response = await fetch(url);
const text = await response.text();

console.log(response.status);
console.log(response.headers.get("content-type"));
console.log(text.slice(0, 200));

try {
  const data = JSON.parse(text);
  console.log(data);
} catch (error) {
  console.error("Invalid JSON:", error);
}

“at position 123” មានន័យដូចម្តេច?

ម៉ាស៊ីនខ្លះរាយការណ៍ទីតាំង បន្ទាត់ ឬជួរឈរ។ រកសញ្ញាសម្រង់ សញ្ញាក្បៀស វង់ក្រចក ឬ escape ខុសនៅជិត។ សន្ទស្សន៍នោះជាកន្លែងការញែកសម្គាល់បញ្ហា; មូលហេតុពិតអាចមុន។ វាមិនធានាថាជាតួអក្សរខុសពិតប្រាកដទេ។

Unexpected token vs Unexpected end

Unexpected token មានន័យថាឧបករណ៍ញែកបានជួបតួអក្សរដែលមិនរំពឹង។ Unexpected end អាចលេចពេលការបញ្ចូលឈប់មុនតម្លៃពេញ ដូច {“name”:“Alex” គ្មានវង់ក្រចកបិទ។ ពាក្យពិតប្រាកដអាស្រ័យលើម៉ាស៊ីន។ កំហុស JSON ធម្មតា: សញ្ញាក្បៀសចុងក្រោយ សញ្ញាសម្រង់ និង Unexpected token គ្របដណ្តប់ JSON មិនពេញលេញទូលំទូលាយជាង។

{"name":"Alex"

JSON មិនដូចលីតេរ៉ាល់វត្ថុ JavaScript

JSON ជាទម្រង់ទិន្នន័យ។ លីតេរ៉ាល់វត្ថុ JavaScript ជាវាក្យសម្ពន្ធ JavaScript។ វត្ថុ JS ដែលមានសោគ្មានសញ្ញាសម្រង់ សញ្ញាសម្រង់តែមួយ និងសញ្ញាក្បៀសចុងក្រោយមិនមែនអត្ថបទ JSON ត្រឹមត្រូវ។ JSON.parse មិនអាចញែកលីតេរ៉ាល់វត្ថុ JavaScript ដោយសុវត្ថិភាព។

const data = {
  name: 'Alex',
  active: true,
};

{
  "name": "Alex",
  "active": true
}

JSON អាចមានមតិទេ?

JSON ស្តង់ដារមិនគាំទ្រមតិ។ បន្ទាត់ // ក្នុងវត្ថុមិនត្រឹមត្រូវ។ JSON5 និងផ្នែកបន្ថែមស្រដៀងគ្នាជាទម្រង់ផ្សេង។ រៀប JSON / Diff ផ្ទៀងផ្ទាត់ JSON ស្តង់ដារដោយ JSON.parse និងមិនចាត់ទុក JSON5 ជា JSON។

{
  // user name
  "name": "Alex"
}

undefined, NaN និង Infinity ជា JSON ត្រឹមត្រូវទេ?

ទេ។ តម្លៃ JSON គឺវត្ថុ អារេ ខ្សែអក្សរ លេខ true false និង null។ undefined, NaN និង Infinity មិនមែន។ តម្លៃកម្រិតកំពូលមិនចាំបាច់ជាវត្ថុ ឬអារេទេ: true, 123, “hello” និង null ជា JSON ត្រឹមត្រូវ។

{"a":undefined}
{"a":NaN}
{"a":Infinity}

true
123
"hello"
null

របៀបកែកំហុស Unexpected token ជាជំហានៗ

ធ្វើការលើប្រភព មិនមែនខ្សែអក្សរកំហុស:

1. បញ្ជាក់ថាការបញ្ចូលពិតជា JSON មិនមែន HTML កំណត់ហេតុ ឬ JavaScript។
2. ពិនិត្យតួអក្សរដំបូងនៃការបញ្ចូលដើម។
3. បើមកពី API ពិនិត្យស្ថានភាព HTTP និង Content-Type។ ទាំង 200 ទាំង application/json មិនធានា JSON ត្រឹមត្រូវ។
4. ផ្ទៀងផ្ទាត់វាក្យសម្ពន្ធក្នុងឧបករណ៍ញែក JSON។
5. ប្រើទីតាំង បន្ទាត់ ឬជួរឈរដែលរាយការណ៍ជាសញ្ញា មិនមែនជាមូលហេតុឫសធានា។
6. ពិនិត្យសញ្ញាសម្រង់ សញ្ញាក្បៀស វង់ក្រចក វង់ការេ និង escape នៅជិតតំបន់នោះ។
7. ប្រៀបធៀបជាមួយច្បាប់ចម្លងដែលបានធ្វើទម្រង់ និងផ្ទៀងផ្ទាត់។
8. កែអ្នករៀបចំ ឬ endpoint។ កុំលុបថូខិនដែលរាយការណ៍ដោយចៃដន្យ។

ប្រើ JSON.stringify() ពេលផលិត JSON ក្នុង JavaScript

ចូលចិត្ត JSON.stringify ជាងការភ្ជាប់ខ្សែអក្សរដោយដៃ។ វាបញ្ចេញអត្ថបទ JSON ត្រឹមត្រូវសម្រាប់តម្លៃដែលវារៀបចំ។ វាមិនរក្សារាល់តម្លៃ JavaScript: undefined អនុគមន៍ និងនិមិត្តសញ្ញាមានឥរិយាបថពិសេស។ ព័ត៌មានលម្អិតនោះនៅក្រៅវិសាលភាពទីនេះ។

const data = {
  name: "Alex",
  active: true
};
const json = JSON.stringify(data);
// {"name":"Alex","active":true}

JSON មិនត្រឹមត្រូវ vs ការកែពិត

គូទាំងនេះត្រូវបានពិនិត្យដោយ JSON.parse។ សម្រាប់ HTML ការកែគឺចម្លើយ មិនមែនកែវាក្យសម្ពន្ធ។

បញ្ហា	មិនត្រឹមត្រូវ	ការកែ
សញ្ញាសម្រង់តែមួយ	{'a':1}	{"a":1}
សញ្ញាក្បៀសចុងក្រោយ	{"a":1,}	{"a":1}
សោគ្មានសញ្ញាសម្រង់	{a:1}	{"a":1}
undefined	{"a":undefined}	{"a":null}
រូបកាយ HTML	<html>...	ពិនិត្យ endpoint និងចម្លើយដើម។ កុំកែ HTML ទៅជា JSON។

មគ្គុទ្ទេសក៍សម្រេចចិត្ត Unexpected token សាមញ្ញ

បើ JSON.parse បរាជ័យ សម្រេចថាតើអ្នកមាន JSON សោះឬទេ មុនសរសេរសញ្ញាសម្រង់ឡើងវិញ។

• JSON.parse បរាជ័យ
• ↓
• មកពី API? ពិនិត្យស្ថានភាព Content-Type និងរូបកាយដើម
• ចាប់ផ្តើមដោយ JSON? បើមិនមែន កែប្រភព ឬ endpoint
• បើបាទ/ចាស ផ្ទៀងផ្ទាត់សញ្ញាសម្រង់ សញ្ញាក្បៀស វង់ក្រចក វង់ការេ escape តម្លៃមិនគាំទ្រ
• ប្រើទីតាំងដែលរាយការណ៍ជាសញ្ញា
• ↓
• កែប្រភព បន្ទាប់មកញែកម្តងទៀត

ផ្ទៀងផ្ទាត់ JSON មុនញែក ឬប្រើ

NEXNARA រៀប JSON / Diff ផ្ទៀងផ្ទាត់ JSON ក្នុងកម្មវិធីរុករកដោយ JSON.parse—មិនមែន eval។

ផ្ទៀងផ្ទាត់ ធ្វើឲ្យស្អាតដោយចន្លោះ ២ ចន្លោះ ៤ ឬថេប minify ចម្លង ទាញយក និងផ្ទុកឡើង .json។ JSON Diff គ្របដណ្តប់វត្ថុ និងអារេដាក់ក្នុងគ្នា ផ្លូវ សង្ខេប តម្រង និងប្តូរ។ បន្ទាប់ពីញែក ច្បាប់ចម្លងស្អាត និង minify នៃទិន្នន័យដដែលប្រៀបធៀបស្មើ; សោវត្ថុប្រៀបធៀបតាមឈ្មោះ។

អត្ថបទធំជាង 5 MB អាចហាក់យឺត។ អត្ថបទធំជាង 15 MB មិនដំណើរការក្នុងកម្មវិធីរុករក។

ការផ្ទៀងផ្ទាត់ និងធ្វើទម្រង់ JSON កើតក្នុងកម្មវិធីរុករករបស់អ្នក។ ឧបករណ៍នេះមិនផ្ញើ JSON ទៅម៉ាស៊ីនមេ NEXNARA។ ពាណិជ្ជកម្ម និងលក្ខណៈគេហទំព័រផ្សេងទៀតនៅតែប្រើបណ្តាញ។

បិទភ្ជាប់ខ្សែអក្សរដែលបរាជ័យទៅ រៀប JSON / Diff ហើយអានតួអក្សរដំបូងមុនសរសេរសញ្ញាសម្រង់ឡើងវិញ។

FAQ

ហេតុអ្វី JSON.parse និយាយ Unexpected token?

អត្ថបទមិនមែន JSON ត្រឹមត្រូវនៅចំណុចដែលឧបករណ៍ញែកឈប់។ មូលហេតុធម្មតាគឺសញ្ញាសម្រង់ សញ្ញាក្បៀស អត្ថបទបន្ថែម ឬរូបកាយមិនមែន JSON ដូច HTML។

Unexpected token < ក្នុង JSON មានន័យដូចម្តេច?

តួអក្សរមិនស្របច្បាប់ដំបូងអាចជា <។ នោះច្រើនតែចង្អុលទៅទំព័រ HTML ប៉ុន្តែមិនមែនភស្តុតាងនៃ 404 ឬ HTML ក្នុងគ្រប់ករណី។ ពិនិត្យស្ថានភាព Content-Type និងរូបកាយដើម។

របៀបរកទីតាំងកំហុសក្នុង JSON?

បើម៉ាស៊ីនរាយការណ៍ទីតាំង បន្ទាត់ ឬជួរឈរ មើលនៅជិត។ កំហុសពិតអាចមុន។ ប្រើជាសញ្ញា បន្ទាប់មកផ្ទៀងផ្ទាត់។

JSON អាចប្រើសញ្ញាសម្រង់តែមួយទេ?

ទេ។ ខ្សែអក្សរ JSON ស្តង់ដារ និងឈ្មោះសមាជិកប្រើសញ្ញាសម្រង់ពីរ។

JSON អាចមានសញ្ញាក្បៀសចុងក្រោយទេ?

ទេ។ JSON ស្តង់ដារមិនអនុញ្ញាតសញ្ញាក្បៀសបន្ទាប់ពីលក្ខណៈ ឬធាតុអារេចុងក្រោយ។

របៀបពិនិត្យថាខ្សែអក្សរជា JSON ត្រឹមត្រូវ?

ហៅ JSON.parse ក្នុង try/catch ឬបិទភ្ជាប់អត្ថបទទៅ រៀប JSON / Diff។ បើការញែកបោះ SyntaxError ខ្សែអក្សរមិនមែន JSON ត្រឹមត្រូវ។