حل مشكلة ‘نهاية غير متوقعة للإدخال’ في Fetch API عند استخدام response.json()

عند استخدام واجهة برمجة التطبيقات (API) Fetch لاسترجاع بيانات JSON من خادم REST على الخادم المحلي، وعند محاولة تحليل الاستجابة باستخدام response.json()، أواجه خطأ غير متوقع يظهر كـ “نهاية غير متوقعة للإدخال”.

يمكن تكرار الخطأ بسهولة على الخادم المحلي باستخدام الأمر البسيط التالي:

javascriptCopy code
fetch(new Request('http://localhost:9950/RestService/v2/search/find/1', {mode: 'no-cors'})).then(function(response) { response.json(); });

// إخراج من وحدة التحكم في Chrome:
// Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}
// VM424:1 Uncaught (in promise) SyntaxError: Unexpected end of input
//     at SyntaxError (native)
//     at <anonymous>:1:128

عند فحص علامة الشبكة، يمكنني رؤية أن الطلب الخاص بي تم استيفاؤه بواسطة الخادم، وإذا قمت بمعاينة الاستجابة، يمكنني رؤية أن هناك JSON صالح متاح هنا (تحققت من ذلك بنسخ ولصق JSON من علامة استجابة الشبكة إلى jsonlint.com). فيما يلي عينة من الاستجابة التي أحصل عليها من الخادم:

jsonCopy code
{
    "SearchMatches": [{
        "Extracts": ["<b>1<\/b>.txt...", "<b>1<\/b>"],
        "Title": "1.txt",
        "Url": "C:\\TestShare4\\500Docs\\1.txt"
    }]
}

إذا حاولت استخدام response.text() بدلاً من response.json()، أحصل على سلسلة فارغة.

أي أفكار حول المكان الذي قد أخطأت فيه؟

يرجى مراعاة أن لدي متطلبات لعدم الاعتماد على أي أطُر أو مكتبات أخرى بخلاف ما يدعمه المتصفح بشكل أساسي.

المشكلة التي تواجهك قد تكون ناتجة عن الاستخدام غير الصحيح لواجهة برمجة التطبيقات (API) Fetch في محاولة استرجاع بيانات JSON من خادم REST على الخادم المحلي. تظهر الرسالة “نهاية غير متوقعة للإدخال” عادةً عندما تحاول تحليل JSON من استجابة فارغة أو غير صحيحة.

أحد الأسباب المحتملة لحدوث هذا الخطأ هو أن الوضع (mode) الذي تم استخدامه في الطلب ({mode: 'no-cors'}) قد يكون يحد من إمكانية الوصول إلى البيانات. يفضل استخدام الوضع الافتراضي ('cors') لتمكين الوصول الكامل إلى الاستجابة.

تحقق من تحليل الاستجابة قبل محاولة استخدام response.json() للتأكد من أن الاستجابة تحتوي على بيانات JSON صحيحة. يمكنك استخدام response.text() لعرض نص الاستجابة والتحقق من صحته.

قد يكون هناك أيضًا مشكلة في تنسيق البيانات JSON على الخادم أو أن هناك أي مشكلة في الاتصال بالخادم نفسه. تحقق من سجلات الخادم للتحقق من أن الطلب يتم معالجته بشكل صحيح وأن البيانات المرسلة صحيحة.

في حال استمرار المشكلة، يمكنك استخدام أدوات تصحيح الأخطاء مثل Chrome DevTools لتفحص الشبكة وعرض تفاصيل الطلب والاستجابة بشكل دقيق.

بشكل عام، يُفضل استخدام الوضع 'cors' بدلاً من 'no-cors' للوصول الكامل إلى الاستجابة، والتحقق من تنسيق البيانات وصحتها قبل محاولة تحليلها كـ JSON.