Next.js: Маршрут API Next.js 9 работает с запросом Get, но не с запросом Post

Созданный на 14 июл. 2019  ·  23Комментарии  ·  Источник: vercel/next.js

Вопрос о Next.js

Я пытаюсь изменить некоторые api, чтобы использовать post вместо get.
У меня есть такой код запроса с обычной выборкой

 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 это должно быть исправлено в последней канарейке

На это когда-нибудь ответили? Есть ли способ выполнить POST для следующего маршрута API v9?

На это когда-нибудь ответили? Есть ли способ выполнить POST для следующего маршрута API v9?

да. Просто отправка в маршруты api будет работать нормально. Используйте этот пример и измените доступ к публикации. Вот что я сделал. Сработало как шарм 😉

@ huv1k есть идеи по

@lifeiscontent выпуск чего?

@ huv1k, когда выйдет следующий выпуск next.js с этим исправлением

@lifeiscontent Ошибка, которую нужно исправить. Я проверил это на себе. POST работает нормально, если вы используете примеры NextJS. Это правильно что-то в вашем приложении. Приведите пример полного кода, чтобы мы могли помочь в расследовании 👍

легко, легко
на вашем _пользовательском сервере_
делать

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

Если у кого-то еще есть эта проблема с пользовательским экспресс-сервером, она может возникнуть при использовании нескольких парсеров тела, потому что маршруты API NextJs включают ее по умолчанию. Используйте только экспресс-парсер тела или только парсер тела NextJs. Как отключить парсер тела NextJs, описанный там: https://nextjs.org/docs#api -middlewares

@epranka @thgh , Чувак, мне потребовались часы, чтобы разобраться в этом.

Я использую сервер Firebase Cloud Functions и не могу отправлять запросы POST к моему маршруту API. Запросы POST зависали, но запросы GET работали нормально. И если бы я использовал локальный сервер разработки NextJS, запросы POST также работали бы нормально.

Отключение парсера тела при использовании Firebase Cloud Functions исправило это.

Судя по всему, Firebase Cloud Functions поставляется со своим собственным парсером тела и конфликтует с парсером NextJS. Поэтому вам нужно отключить парсер тела для облачных функций Firebase, но включить его для локальной разработки с помощью сервера разработки NextJS.

Так что просто поместите это в свой 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));

Большое спасибо!

@epranka @thgh , Чувак, мне потребовались часы, чтобы разобраться в этом.

Я использую сервер Firebase Cloud Functions и не могу отправлять запросы POST к моему маршруту API. Запросы POST зависали, но запросы GET работали нормально. И если бы я использовал локальный сервер разработки NextJS, запросы POST также работали бы нормально.

Отключение парсера тела при использовании Firebase Cloud Functions исправило это.

Судя по всему, Firebase Cloud Functions поставляется со своим собственным парсером тела и конфликтует с парсером NextJS. Поэтому вам нужно отключить парсер тела для облачных функций Firebase, но включить его для локальной разработки с помощью сервера разработки NextJS.

Так что просто поместите это в свой pages/api/[yourEndPoint].js :

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

Спасибо! Столкнулся с той же проблемой. Решено с вашим исправлением. Удивительно, что функции Firebase не дают никакой конфигурации для отключения автоматического анализа тела.

поэтому мы должны использовать собственный сервер, но получение проанализированного тела внутри маршрута api решило бы многие проблемы.

Была ли эта страница полезной?
0 / 5 - 0 рейтинги