Next.js: يعمل مسار واجهة برمجة تطبيقات Next.js 9 على "الحصول على طلب" وليس على "طلب النشر"

تم إنشاؤها على ١٤ يوليو ٢٠١٩  ·  23تعليقات  ·  مصدر: vercel/next.js

سؤال حول Next.js

أحاول تعديل بعض واجهة برمجة التطبيقات لاستخدام المنشور بدلاً من الحصول عليه.
لدي طلب رمز مثل هذا مع الجلب العادي

 const response = await fetch(`${process.env.SERVER}/api/lyric?id=${song.song_id}`);

سيصل إلى الملف الموجود بداخله ./page/api ويحل ، على الرغم من ذلك ، إذا قمت بالتغيير إلى الكود التالي

 const response = await fetch(`${process.env.SERVER}/api/lyric`, {
                    method: 'POST',
                    body: JSON.stringify({id: song.song_id})
                });

سيعطيني 404 غير موجود. أتساءل ما هي المشكلة هنا؟

شكرا لك

التعليق الأكثر فائدة

أرى أيضًا 404 في مشروعنا بما يلي:

const res = await fetch('/api/bookings', {
  method: 'POST',
  body: JSON.stringify({ hungry: true }),
  headers: {
    'Content-Type': 'application/json',
  },
})
const data = await res.json()

لا يهم محتوى الملف api/bookings . لن يتم ضربه أبدا. أنا أستخدم now dev لتشغيل المشروع على المضيف المحلي

تحديث
اكتشفت أنه يعمل بشكل جيد مع now dev لكنه لم يعمل مع ملف server.js نظرًا لأنني لم أتعامل مع طلبات النشر. إذا قمت ببساطة بإضافة معالج لطلب النشر ، فسيعمل كل شيء بشكل جيد:

server.post('*', (req, res) => {
  return handle(req, res)
})

ال 23 كومينتر

مرحبًا @ zluo01 ، قدم استنساخًا كاملاً ، من الصعب تخمين ما يمكن أن يكون خطأ من مشكلتك. يمكنك التحقق من اختبار التكامل لـ POST .

هل كنت قادرًا على اكتشاف ذلك؟ وثائق مسارات API قليلة جدًا ، وأتلقى أيضًا استجابة 404 لطلبات POST المرسلة إلى مسار يعمل بشكل جيد لطلبات GET

هل كنت قادرًا على اكتشاف ذلك؟ وثائق مسارات API قليلة جدًا ، وأتلقى أيضًا استجابة 404 لطلبات POST المرسلة إلى مسار يعمل بشكل جيد لطلبات GET

عذرًا لا ، أستخدم Get وأضع الأشياء داخل الرؤوس بدلاً من ذلك وليس لدي وقت لإنتاج نسخة كاملة.

قد تكون بعض الوثائق الخاصة بالتعامل مع POST مفيدة

stoplion ماذا تريد أن توثق؟ هل يمكنك إنشاء مشكلة باتباع نموذج المشكلة لها؟

بالتأكيد

أرى أيضًا 404 في مشروعنا بما يلي:

const res = await fetch('/api/bookings', {
  method: 'POST',
  body: JSON.stringify({ hungry: true }),
  headers: {
    'Content-Type': 'application/json',
  },
})
const data = await res.json()

لا يهم محتوى الملف api/bookings . لن يتم ضربه أبدا. أنا أستخدم now dev لتشغيل المشروع على المضيف المحلي

تحديث
اكتشفت أنه يعمل بشكل جيد مع now dev لكنه لم يعمل مع ملف server.js نظرًا لأنني لم أتعامل مع طلبات النشر. إذا قمت ببساطة بإضافة معالج لطلب النشر ، فسيعمل كل شيء بشكل جيد:

server.post('*', (req, res) => {
  return handle(req, res)
})

TommySorensen يجب إصلاح هذا في أحدث إصدار من الكناري

هل تم الرد على هذا من قبل؟ هل هناك طريقة للنشر إلى مسار واجهة برمجة تطبيقات الإصدار 9 التالي؟

هل تم الرد على هذا من قبل؟ هل هناك طريقة للنشر إلى مسار واجهة برمجة تطبيقات الإصدار 9 التالي؟

نعم فعلا. مجرد النشر على مسارات api سيعمل بشكل جيد. استخدم هذا المثال وقم بتغيير الوصول للنشر. هذا ما فعلته. عملت كالسحر 😉

@ huv1k أي فكرة عن الإصدار؟

lifeiscontent الافراج عن ماذا؟

@ huv1k عندما

lifeiscontent لا يوجد خطأ لإصلاحه. اختبرت ذلك بنفسي. يعمل POST بشكل جيد إذا كنت تستخدم أمثلة NextJS. إنه شيء صحيح في التطبيق الخاص بك. يرجى تقديم مثال على الشفرة الكاملة ، حتى نتمكن من المساعدة في التحقيق 👍

سهل deasy
في خادمك المخصص
فعل

server.use((req, res) => app.getRequestHandler()(req, res))

ريبرو:

npx create-next-app --example with-firebase-authentication with-firebase-authentication-app

أضف ملف api / test.js

export default (req, res) => {
  console.log('api test', req.method)
  res.json('ok')
}

أضف معالج الطلب في server.js:

server.use((req, res) => app.getRequestHandler()(req, res))

تشغيل yarn dev (أو node server.js )

أرسل POST إلى http: // localhost : 3000 / api / test

المتوقع: سجلات وحدة التحكم api test POST
فعلي: لا توجد سجلات ، ويظل الطلب معلقًا حتى انتهاء المهلة

تحتاج إلى تحديث المثال:

  server.get('*', (req, res) => {
    return handle(req, res)
  })

يجب أن يكون:

  server.all('*', (req, res) => {
    return handle(req, res)
  })

وجدنا خطأنا: ترقية isomorphic-unfetch => لا تقم بالترقية 🤕

بالمناسبة ، تبعية Firebase قديمة جدًا:

 firebase             ^5.6.0  →    ^7.2.1
 firebase-admin       ^5.8.2  →    ^8.6.1

إذا كان لدى أي شخص هذه المشكلة حتى الآن مع خادم سريع مخصص ، فيمكن أن يحدث ذلك أثناء استخدام محللات متعددة للجسم ، لأن مسارات NextJs api تمكنها افتراضيًا. استخدم فقط المحلل اللغوي السريع للجسم ، أو محلل الجسم NextJs فقط. كيفية تعطيل محلل جسم NextJs الموثق هناك: https://nextjs.org/docs#api -middlewares

eprankathgh ، يا رجل ، استغرق الأمر مني ساعات لمعرفة هذا.

أنا أستخدم خادم Firebase Cloud Functions ، ولا يمكنني تقديم أي طلبات POST إلى مسار واجهة برمجة التطبيقات. ستتوقف طلبات POST ، لكن طلبات GET ستعمل بشكل جيد. وإذا كنت أستخدم خادم تطوير NextJS المحلي ، فستعمل طلبات POST أيضًا بشكل جيد.

تعطيل المحلل اللغوي للجسم عند استخدام Firebase Cloud Functions إصلاحه.

يبدو أن Firebase Cloud Functions يأتي مع محلل الجسم الخاص به ، ويتعارض مع NextJS. لذلك يتعين عليك تعطيل محلل الجسم لوظائف Firebase Cloud ، ولكن يمكنك تمكينه للتطوير المحلي باستخدام خادم NextJS dev.

لذلك قم بإسقاط هذا بشكل أساسي في pages/api/[yourEndPoint].js :

export const config = {
  api: {
    bodyParser: process.env.NODE_ENV !== 'production'
  }
};

TommySorensen الإجابة حلها بالنسبة لي:

  server.get("*", (req, res) => handle(req, res));
  server.post("*", (req, res) => handle(req, res));

تشكرات!

eprankathgh ، يا رجل ، استغرق الأمر مني ساعات لمعرفة هذا.

أنا أستخدم خادم Firebase Cloud Functions ، ولا يمكنني تقديم أي طلبات POST إلى مسار واجهة برمجة التطبيقات. ستتوقف طلبات POST ، لكن طلبات GET ستعمل بشكل جيد. وإذا كنت أستخدم خادم تطوير NextJS المحلي ، فستعمل طلبات POST أيضًا بشكل جيد.

تعطيل المحلل اللغوي للجسم عند استخدام Firebase Cloud Functions إصلاحه.

يبدو أن Firebase Cloud Functions يأتي مع محلل الجسم الخاص به ، ويتعارض مع NextJS. لذلك يتعين عليك تعطيل محلل الجسم لوظائف Firebase Cloud ، ولكن يمكنك تمكينه للتطوير المحلي باستخدام خادم NextJS dev.

لذلك قم بإسقاط هذا بشكل أساسي في pages/api/[yourEndPoint].js :

export const config = {
  api: {
    bodyParser: process.env.NODE_ENV !== 'production'
  }
};

شكرا! كان يواجه نفس المشكلة بالضبط. حل مع الإصلاح الخاص بك. من المدهش أن وظائف Firebase لا تعطي أي تهيئة لإيقاف التحليل التلقائي للجسم.

لذلك علينا استخدام خادم مخصص ، حصلنا عليه ولكن الحصول على الجسم المحلل داخل مسار api كان سيحل العديد من المشكلات.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات