Как подключить мою html-форму к моему api с помощью express?

#html #node.js #express

#HTML #node.js #экспресс

Вопрос:

Как подключить html-форму к api с помощью node express?

Моя форма выглядит так:

 lt;form action="/api" id="myform" method="GET"gt;  lt;fieldset id="question-set1" class="checkboxes"gt;  lt;input type="checkbox" id="option1"gt;  lt;label for="option1"gt;Option 1lt;/labelgt;  lt;input type="checkbox" id="option2"gt;  lt;label for="option2"gt;Option 2lt;/labelgt;   lt;/fieldsetgt;  lt;button type="submit" for="myform"gt;Nextlt;/buttongt; lt;/formgt;  

Мой server.js является

 const express = require('express'); const bodyParser = require('body-parser') const routes = require('./routes/api')  const app = express();  app.use(bodyParser.json())  app.use("/", express.static( __dirname   '/public' ))  app.use("/api", routes);  app.use(function(err, req, res, next){  console.log(err)  res.status(422).send({error:err.message}) })  app.listen(process.env.port || 4000, function(){  console.log("now listening on port 4000") });  

Мой api.js файл (который хранится в поддире маршрутов) является:

 const express = require('express'); const router = express.Router();  router.get('/api', function(req, res, next){  console.log('GET REQUEST')  res.send({type: 'GET'})   });  module.exports = router;  

Это приводит к ошибке «Не удается получить /api» в браузере, когда я нажимаю кнопку «Отправить».

Должен ли атрибут действия формы быть эквивалентен пути в api.js досье?

Конечная цель состоит в том, чтобы выполнять действия в зависимости от параметров пользователя при отправке, но сейчас я пытаюсь заставить узел консоли регистрировать тестовое сообщение «ПОЛУЧИТЬ ЗАПРОС» и отправлять простой ответ, чтобы знать, что он работает.

Ответ №1:

server.js файл

Поскольку вы используете метод GET в своей форме, и ваше действие направляется в «/api», создайте конечную точку как app.get («/api») и выполните логику внутри этого. Значения формы могут быть прочитаны как req.body.(…)

 app.get('/api', (req, res) =gt; {  //your logic  })