【问题标题】:Cant get the data from form post to nodeJS server无法从表单发布到 nodeJS 服务器的数据
【发布时间】:2018-09-09 09:27:47
【问题描述】:

我正在尝试编写登录页面。我得到了带有登录框的html页面 我输入电子邮件和密码而不是提交到服务器,在服务器上我得到路由谁在数据库上检查数据如果文档存在,如果它存在应该重定向到主页 问题是我从表单发送到服务器的数据总是未定义我在这里检查其他 ppl 问题,我没有找到任何好的结果

html登录页面:

<!DOCTYPE html>
<html>
  <head>
     <meta charset="utf-8">
     <link rel="stylesheet" type="text/css" href="/css/style.css" />
     <title>{{PageTitle}}</title>
  </head>
  <body>
    {{> header}}

    <div class="login-box">
      <div class="form">
        <form action="/get_user" method="post" class="login-form">
          <input type="email" name="Email" placeholder="Email"/>
          <input type="password" name="Password" placeholder="Password"/>
          <button type="submit">login</button>
        </form>
      </div>
    </div>

    {{> footer}}
 </body>

服务器代码:

const _ = require('lodash');
const express = require('express');
const bodyParser = require('body-parser');
const {mongoose} = require('./db/mongoose');
const hbs = require('hbs');

var {User} = require('./models/user');

var app = express();
app.set('view engine', 'hbs');
const port = process.env.PORT;
hbs.registerPartials(__dirname + '/../views/partials');

app.user(bodyParser.json());

app.use(express.static(__dirname + '/../public'));
app.use(express.static(__dirname + '/../public/images'));
app.use(express.static(__dirname + '/../public/fonts'));

app.listen(port, () => {
  console.log(`Started on port ${port}`);
});

app.get('/', (req, res) => {
  res.render('login.hbs', {
    PageTitle: 'Log In',
    ConnectUser: 'Guest'
  });
});

app.post('/get_user', (req, res) => {
 var body = _.pick(req.body, ['Email , 'Password']);

 User.findOne({
   Email: body.Email,
   Password: body.Password
 }).then((user) => {
  console.log(body.Email + ' ' + body.Password);
  if(!user) {
    return res.status(404).send();
  }
  var fullName = user.First_Name + ' ' + user.Last_Name;
  res.redirect('/mainPage', {ConnectUser: fullName});
}).catch((e) => {
  res.status(400).send();
 });
});

我做了很少的检查,当我调用 /get_user req.body->var body -> user r empty 数据从表单传递到服务器我也在邮递员上检查了这条路线,当我自己写正文时发现它的工作我能想到的唯一问题是我从表单发送的数据作为 json 发送,而正文解析器只发送json 格式,所以也许我需要更改行

app.use(bodyParser.json());

如果有任何 1 可以朝着正确的方向发展,那么就无法评价那个 ty。

【问题讨论】:

  • 试试console.log(req) 和req.body。我猜当你这样做时问题就来了_.pick(...
  • 您的服务器示例中有错字,如果它实际上在您的代码中,则不是问题的根源,但如果是“app.user”,则应该是“app.use”
  • 它只在这里,在我的代码中它的“使用”和一些 1 只是为您的回复找到问题

标签: node.js html


【解决方案1】:

当使用带有方法 post 的 html 表单时,数据以Content-Type: application/x-www-form-urlencoded 而不是 JSON 形式发布到服务器。

Json bodyparser 不会对此做任何事情,因为它不使用 JSON 格式来发送数据。 post方法见 MDN guide。

在您的服务器代码中,在app.use(bodyParser.json()) 下方添加以下内容:

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

这将以您期望的方式将数据添加到请求正文中。

【讨论】:

    【解决方案2】:

    尝试使用 form enc-type 属性,看看如何配置 bodyparser 以根据 enc-type 获取所需的值。

    • application/x-www-form-urlencoded
    • 多部分/表单数据

    https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/enctype

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-07-08
      • 1970-01-01
      • 2021-06-03
      • 2018-09-11
      • 2020-07-17
      • 2022-01-27
      • 2020-06-14
      • 2019-02-06
      相关资源
      最近更新 更多