不能使用快递发帖

Question

（更新）感谢cmets中的许多人，我解决了这个问题，现在我遇到了一个新问题。保存数据后，我似乎无法重定向到主页。我被一个中间 HTML 卡住了，它向我显示了保存的 JSON 语句。

我一直在尝试使用 html 表单将信息发布到 API，但我总是收到错误 Cannot POST /。我已经尝试了很多我在 GitHub 上看到的 YouTube 教程和示例，但我似乎无法让它发挥作用。以下是我一直在使用的代码。有什么我做错或没看到的吗？

这是 server.js（虽然我不认为问题出在此处）：

const express = require('express');
const mongoose = require('mongoose');
const app = express();
 
mongoose.connect(process.env.DATABASE_URL, {useNewUrlParser: true, useUnifiedTopology: true })
const db = mongoose.connection
db.on('error', (error) =>  console.error(error))
db.once('open', () => console.log('connected to database'))
 
app.use(express.json())
const jugadorRouter = require('./routes/jugadores')
app.use('/jugadores', jugadorRouter)
 
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => console.log(`Server running on port ${PORT}`));

这是表单所在的索引：

<form name="form" method="post" action="/">
<div class="form-control">
  <label for="username">Usuario</label>
  <input type="text" name="username" id="username" placeholder="Ingrese su usuario..." required />
</div>
<div class="form-control">
  <label for="room">Equipo</label>
  <select name="room" id="room">
    <option value="rojo">Equipo rojo</option>
    <option value="amarillo">Equipo Amarillo</option>
    <option value="blanco">Equipo Blanco</option>
  </select>
</div>
<button id="login" type="submit" class="btn" onclick="javascript: form.action='Gerente.html'" formmethod="post">Gerente</button>                
</form>

这是 jugadores.js post 方法所在的位置：

const express = require('express')
const router = express.Router()
const Jugador = require('../model/jugador')
 
router.post('/', async (req, res) => {
 console.log(req.body);
 const jugador = new Jugador({
  username: req.body.username,
  room: req.body.room
})
try{
  const newJugador = await jugador.save()
  res.status(201).json(newJugador)
}catch(err){
  res.status(400).json({message: err.message})
}
res.render('public/Gerente', {
  username: username,
  room: room
});
res.end();
});
 
module.exports = router

这是我的 jugador.js：

const mongoose = require('mongoose')
//login schema
const jugadorSchema = new mongoose.Schema({
username:{
 type: String,
required: true
},
Date:{
type: Date,
required: true,
default: Date.now
}
})
 
module.exports = mongoose.model('Jugador', jugadorSchema);

Answer 1

当你的服务器设置好后，你的 POST 路由是/jugadores。

所以表格应该是：

<form name="form" method="post" action="/jugadores">

并且按钮不应该有onclick或formmethod，比如：

<button id="login" type="submit" class="btn">Gerente</button>

另外，让服务器可以处理表单添加：

app.use(express.urlencoded({extended: true}))

Answer 2

原答案

1.您已指定在 server.js (app.use('/jugadores', jugadorRouter)) 中的每个 api 路由之前使用 /jugadores，因此在 Html 页面中，您的操作将如下所示

html

 <form name="form" method="post" action="/jugadores/">

如果您想使用此代码，您的 api 调用将如下所示 http://localhost:3000/jugadores/，更改将在您的 html 表单中完成

和

2.如果您只想在路由中使用/ 而不是从app.use('/jugadores', jugadorRouter) 中删除/jugadores，那么在Html 页面中，您的操作将如下所示

html

 <form name="form" method="post" action="/">

server.js

  app.use(jugadorRouter)

如果您想使用此代码，您的 api 调用将如下所示 http://localhost:3000/，更改将在您的 server.js 文件中完成

更新

正如您在评论中提到的那样，您遇到了错误

{"message":"Jugador 验证失败：用户名：路径用户名是必需的。房间：路径房间是必需的。"}

要在 Express 中接收 POST 值，您首先需要包含 body-parser 中间件，它会在您的路由处理程序中公开 req.body 上提交的表单值。如本文所述tutorial

先安装body-parser

在server.js

var bodyParser = require('body-parser');

app.use(bodyParser.urlencoded({
    extended: true
}));

Answer 3

1.错误是什么意思？

• 在创建快速服务器时，您注册了一个路由处理程序列表。错误Cannot POST /表示express找不到路由的POST注册/。

2。目前情况如何？

• 完成后，表单提交发送POST请求到路由/
• express 搜索其路由注册列表。它找不到POST / 请求的路由句柄。所以它大喊错误

3.如何解决？

• 当你声明像app.use('/jugadores', jugadorRouter)这样的路由器处理程序时，路由器处理程序的路径将以/jugadores为前缀。因此，jugadores.js 中的POST / 实际上会变成POST /jugadores
• express 目前唯一的路由句柄是POST /jugadores。似乎应该在这里处理表单提交。因此，您可以像这样更改 html 表单操作值

<form name="form" method="post" action="/jugadores">

感谢阅读！