Как настроить сервер NODEJS Express для приема POST-запроса

Итак, я работаю над этим приложением-викториной, которое использует API Gemini для формулирования вопросов. Мой интерфейс использует HTML, CSS и JavaScript (Vanilla), а серверная часть основана на Node.JS (Express).

Всякий раз, когда я отправляю запрос на выборку с помощью API-интерфейса Fetch с входными данными формы от пользователя, я всегда получаю этот ответ на консоли;

POST http://127.0.0.1:5500/genQuestions net::ERR_ABORTED 405 (Method Not Allowed)

См. соответствующий запрос index.js fetch ниже:

await fetch('http://127.0.0.1:5500/genQuestions', { // On the console, this line is usually marked red
    method: 'POST',
    headers: {
      "Content-type": "application/json"
    },
    body: JSON.stringify(formObj), // The form Data Object
  })
  .then(response => {
    // Handle the server's response   
  })

Экспресс JS:

// Setting up CORS this way
const cors = require('cors');
app.use(cors());
// Receive Post Requests
app.post('/genQuestions', async (req, res) =>{
  const formData = req.body;

  // Generate questions
})

Моя структура файлов с соответствующими файлами показана ниже: Изображение, показывающее структуру файлов проекта

Мой вопрос: как мне заставить мой сервер получать запросы на публикацию? Я чувствую, что возможность изменить «Разрешить: GET, HEAD, OPTIONS», включив в него «POST» (см. Заголовок ответа ниже), должна помочь, но я действительно не знаю, как это изменить.

Я ценю любой совет, который могу получить. Как я уже говорил ранее, я новичок в NodeJS.

См. заголовки ответов на вкладке «Сеть» ниже:

// Response Header from Network Tab
HTTP/1.1 405 Method Not Allowed
Access-Control-Allow-Origin: http://127.0.0.1:5500
Vary: Origin
Access-Control-Allow-Credentials: true
Allow: GET, HEAD, OPTIONS
Content-Length: 0
Date: Mon, 17 Jun 2024 11:09:23 GMT
Connection: keep-alive
Keep-Alive: timeout=5

Для тех, кто спрашивает, я включил свои файлы index.js и server.js в этот Codepen. Там он не запустится, но я уверен, что вы сможете увидеть мой текущий код, который выдает сообщение «Метод 405 не разрешен». Ссылка на Codepen

app.post() должен разрешить принимать POST-запросы.
Barmar 17.06.2024 19:01

Пожалуйста, покажите нам весь внутренний код. Что такое app? В каких файлах живут эти два фрагмента? Как вы запускаете приложение nodejs?

Bergi 17.06.2024 19:03

Показать весь блок кода.

Subha 17.06.2024 20:16

Я включил код с обзором моего текущего кода. Вы можете увидеть изменения внизу вопроса @Bergi.

Joseph Nwodo 18.06.2024 08:22

Привет, Джозеф! Кажется, это несоответствие URL-адреса запроса. '127.0.0.1:5500/genQuestions ' и ' 127.0.0.1:5500/gen_questions'

WeDoTheBest4You 18.06.2024 09:44

@WeDoTheBest4You, где ты видишь gen_questions?

Bergi 18.06.2024 10:29

@Bergi, это в index.js, код показан в CodePen, оператор такой ...await fetch('127.0.0.1:5500/gen_questions', {...

WeDoTheBest4You 18.06.2024 10:56
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
7
75
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Во-первых, вы запрашиваете gen_questions в запросе на выборку, но на вашем сервере он определен как genQuestions. Во-вторых, вы используете 127.1.1.0. Вместо этого используйте localhost в своем запросе на выборку. Дайте мне знать, если это работает. Я проверил это на своей стороне, и оно работает отлично.

Это сработало. Мне пришлось сменить 127.0.0.1 на localhost. Сначала я подумал, что это также может заменять localhost😅 Спасибо. И о, «gen_questions» было изменением, когда я пробовал Axios.

Joseph Nwodo 18.06.2024 12:12

127.0.0.1 тоже должен был работать, но я не знаю, почему этого не произошло. Похоже, есть проблемы с прокси или корсом.

Neeraj Jangir 18.06.2024 12:25

Предыдущие сообщения в StackOverflow и другой связанный контент в Интернете обобщают следующие причины проблем такого рода.

  • Неправильно настроены параметры сервера или веб-приложения, ограничивающие определенные HTTP-соединения. такие методы, как POST, GET, PUT или DELETE.
  • Неверный код или скрипты внутри приложения, особенно когда пользовательский код не может быть согласован с ожиданиями серверной стороны.

Цитата:

Статус HTTP 405 — Ошибка метода не разрешена для Rest API

Что такое ошибка 405, метод не разрешен и как ее исправить

Другие вопросы по теме