无法将数据从表单发布到nodeJS服务器

时间：2018-09-09 09:27:47

标签： node.js html5

我正在尝试编写一个登录页面。我得到了带有登录框的html页面 我输入电子邮件和密码，然后提交给服务器，在服务器上，我得到了路由，如果doc存在，则对db进行数据检查，如果存在，则应重定向到主页 问题是我从表单发送到服务器的数据始终未定义，我在此处检查其他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空时 数据从表单传递到服务器的即时消息还检查邮递员的这条路线，并在我自己编写正文时检查它的工作，我唯一想到的问题是我从表单arnt发送为json的数据和正文解析器仅在json格式，所以我可能需要更改行

  

app.use（bodyParser.json（））;

如果有任何一个人可以朝正确的方向进行评估，那该不正确。

2 个答案:

答案 0 :(得分：0)

尝试使用表单enc-type属性，并了解如何配置bodyparser以基于enc-type获取所需的值。

  • application / x-www-form-urlencoded
  • multipart / form-data

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

答案 1 :(得分：0)

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

Json bodyparser将不执行任何操作，因为它不使用JSON格式发送数据。请参见发布方法下的 MDN guide。

在服务器代码的app.use(bodyParser.json())下，添加以下内容：

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

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

相关问题
最新问题