JSON.parse က ဘာကြောင့် "Unexpected token" ဟု ပြောသနည်း?

ဤသည် JSON.parse Unexpected token ပြဿနာဖြေရှင်းခြင်းဖြစ်သည်: အမှား၏ အဓိပ္ပာယ်၊ နေရာကို ဖတ်နည်း၊ ကိုယ်ထည်သည် HTML ဖြစ်သောအခါ လုပ်ရမည့်အရာ။ နောက်ဆုံးကော်မာ၊ ကိုးကားနှင့် Unexpected end အကြောင်း ပိုကျယ်သော အကြောင်းအရာသည် အဖြစ်များသော JSON အမှားများ: နောက်ဆုံးကော်မာ၊ ကိုးကားချက်နှင့် Unexpected token တွင် ရှိသည်။

JSON.parse() တွင် “Unexpected token” ဆိုသည်မှာ အဘယ်နည်း?

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 စာကြောင်းများနှင့် အရာဝတ္ထု အဖွဲ့ဝင်အမည်များသည် နှစ်ထပ်ကိုးကား သုံးသည်။ const user = { name: ‘Alex’ } ကဲ့သို့ JavaScript အရာဝတ္ထု လစ်တရယ်သည် တရားဝင် 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 ကို JSON escape နှင့် မရောပါနှင့်။ အဖြစ်များသော JSON အမှားများ: နောက်ဆုံးကော်မာ၊ ကိုးကားချက်နှင့် Unexpected token ဤအကြောင်း ပိုနက်ရှိုင်းစွာ ဖုံးအုပ်သည်။

မမှန်

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

မှန်

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

၅။ JSON ရှေ့ သို့မဟုတ် နောက် ပိုသောစာသား

JSON.parse သည် JSON တန်ဖိုး တစ်ခုကို မျှော်လင့်သည်။ {“ok”:true} ရှေ့ Success: ကဲ့သို့ ရှေ့ဆက်၊ သို့မဟုတ် နောက် done ကဲ့သို့ နောက်ဆက်သည် စာကြောင်းတစ်ခုလုံး မမှန်စေသည်။ တစ်ခုတည်းသော JSON တန်ဖိုးပတ်လည် အရေးမပါသော အဖြူနေရာ ခွင့်ပြုသည်။ JSON သည် တန်ဖိုးရှေ့ သို့မဟုတ် နောက် နေရာလွတ် တားမြစ်မထားပါ။

Success:
{"ok":true}

{"ok":true}
done

၆။ JSON အစား HTML ခွဲခြမ်းစိတ်ဖြာခြင်း

HTML စာမျက်နှာပေါ် response.json() ခေါ်ခြင်းသည် အဖြစ်များသော Unexpected token အမှုဖြစ်သည်။ မှားသော endpoint၊ 404 သို့မဟုတ် 500 HTML စာမျက်နှာများ၊ အကောင့်ဝင် ပြန်ညွှန်းများ၊ ပရောက်စီ ကိုယ်ထည်များ၊ အရန်စာမျက်နှာများသည် မကြာခဏ အမှတ်အသားဖြင့် စတင်သည်။ “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 ကို ပြင်ပါ။ အစီရင်ခံသော တိုကင်ကို ကျပန်း မဖျက်ပါနှင့်။

JavaScript တွင် JSON ထုတ်လုပ်သောအခါ JSON.stringify() သုံးပါ

လက်ဖြင့် စာကြောင်းများ ပေါင်းခြင်းထက် 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 မဟုတ်။ ပုံမှန် အကြောင်းရင်းများမှာ ကိုးကား၊ ကော်မာ၊ ပိုသောစာသား၊ သို့မဟုတ် HTML ကဲ့သို့ JSON မဟုတ်သော ကိုယ်ထည်ဖြစ်သည်။

JSON တွင် Unexpected token < ဆိုသည်မှာ အဘယ်နည်း?

ပထမ တရားမဝင်သော စာလုံးသည် < ဖြစ်နိုင်သည်။ ထိုအရာသည် မကြာခဏ HTML စာမျက်နှာကို ညွှန်သည်၊ သို့သော် 404 သို့မဟုတ် HTML ဖြစ်ကြောင်း အမှုတိုင်းတွင် သက်သေ မဟုတ်။ အခြေအနေ၊ Content-Type နှင့် မူလကိုယ်ထည် စစ်ပါ။

JSON တွင် အမှားနေရာကို မည်သို့ ရှာမည်နည်း?

ရန်တိုင်းက နေရာ၊ စာကြောင်း သို့မဟုတ် ကော်လံ သတင်းပို့လျှင် အနီးတွင် ကြည့်ပါ။ အမှန်တကယ် အမှားသည် အရင်က ဖြစ်နိုင်သည်။ အရိပ်အမြွက်အဖြစ် သုံးပြီးနောက် စစ်ဆေးပါ။

JSON သည် တစ်ခုတည်းကိုးကား သုံးနိုင်သလား?

မသုံးနိုင်။ စံ JSON စာကြောင်းများနှင့် အဖွဲ့ဝင်အမည်များသည် နှစ်ထပ်ကိုးကား သုံးသည်။

JSON တွင် နောက်ဆုံးကော်မာ ရှိနိုင်သလား?

မရှိနိုင်။ စံ JSON သည် နောက်ဆုံးဂုဏ်သတ္တိ သို့မဟုတ် အခင်းအကျင်း အကြောင်းအရာနောက် ကော်မာကို ခွင့်မပြုပါ။

စာကြောင်းသည် မှန်ကန်သော JSON ဟုတ်မဟုတ် မည်သို့ စစ်မည်နည်း?

try/catch တွင် JSON.parse ခေါ်ပါ၊ သို့မဟုတ် စာသားကို JSON စနစ်တကျ / Diff တွင် ကူးထည့်ပါ။ ခွဲခြမ်းစိတ်ဖြာမှုက SyntaxError ပစ်လျှင် စာကြောင်းသည် မှန်ကန်သော JSON မဟုတ်။