Req.body 在 Node Js 中为空

Question

In my Node application I am trying to view request.body object to check for elements that are coming inside of it but console.log(req.body) revels that its empty.在我的 Node 应用程序中，我试图查看 request.body object 以检查其中的元素，但console.log(req.body)发现它是空的。 Here are my files.这是我的文件。

app.js file below app.js文件如下

var express = require("express");
var app = express();
var mongoose = require("mongoose");
var nationalPark = require("./models/NationalParks");



//config
mongoose.connect('mongodb://localhost/National_Parks', {useNewUrlParser: true, useUnifiedTopology: true}).catch(function(reason){
    console.log('Unable to connect to the mongodb instance. Error: ', reason);
});
app.set('view engine', 'ejs');
var bod = require("body-parser");
app.use(bod.urlencoded({extended:true}));
app.use(bod.json());


app.use(express.static(__dirname + '/resources'));


//Routes
app.get("/",function(req,res){
    nationalPark.find({},function(err,nationalParks){
        if(err){
            console.log(err);
        }else{

            res.render("home",{nationalParks:nationalParks});
        }
    })

});

app.get("/home",function(req,res){
    nationalPark.find({},function(err,nationalParks){
        if(err){
            console.log(err);
        }else{
            console.log(nationalParks);
            res.render("home",{nationalParks:nationalParks});
        }
    })
});

app.get("/login",function(req,res){
    res.render("login");
});
app.get("/signup",function(req,res){
    res.render("signup");
});
app.get("/logout",function(req,res){
    res.render("home");
});

app.get("/NationalPark",function(req,res){
    console.log(park.park)
 res.render("NationalPark",{park:park.park});
});

app.post("/NationalPark",function(req,res){

      console.log(req.body);
    res.render("NationalPark");
});
app.get("/post",function(req,res){
    res.render("post");
});
app.get("/post-display",function(req,res){
    res.render("post-display");
});
app.get("/profile",function(req,res){
    res.render("profile");
});

//listening port
app.listen(3000,function(){
    console.log("Server started");
});

Here is my home.ejs file这是我的home.ejs文件

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link href="https://fonts.googleapis.com/css?family=Pacifico&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="/css/national-parks.css">


  </head>
  <body>


        <div class="container" id="headContainer">
          <div class="row">
            <div class="col-2">
              <nav class="nav flex-column">
                <a class="nav-link active text-white" href="/login">Login</a>
                <a class="nav-link active text-white" href="/signup">Sign Up</a>
                <a class="nav-link active text-white" href="/logout">Logout</a>
              </nav>
            </div>

            <div class="col-10" id="heading">
              <h1 class="display-3">National Parks Observer</h1>
              <p class="lead">Site Dedicated to Indian National Parks</p>
             </div>


         </div>
        </div>




        <div class="container" id="postings">

         <%  var r=Math.round(nationalParks.length/3); %>
         <% var x = 1; %>
         <% var elementCount = 3; %>
         <% var constant = 3; %>
         <% var start=0; %>
         <% while(x<=r){ %>
          <div class="row">

           <% for(var k=start;k<elementCount;k++){ %>

            <div class="col-4">
              <div class="card">

               <form method="POST" action="/NationalPark">  
                <img class="card-img-top" src=<%=nationalParks[k].imageurl %> alt="Card image cap">


                <h5 class="card-title" name="parktitle" id="title"><%=nationalParks[k].nationalPark %></h5>

                  <button type="submit" class="btn btn-primary btn-sm"">View Page</button>

                </form> 

              </div>
           </div>

           <% } %>
           <%  start=start+constant; %>
           <%   elementCount=Math.min(elementCount+constant,nationalParks.length); %>


          </div>

          <% x++; }  %>










        </div>


        <br>
        <br>
        <br>



    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

    <script src="/javascript/national-park.js"></script>     

  </body>
</html>

at following post method in app.js在app.js中的以下 post 方法

app.post("/NationalPark",function(req,res){

      console.log(req.body);
    res.render("NationalPark");
});

console.log(req.body) simply prints {} console.log(req.body)只是打印{}

Why is it happening, am I missing something?为什么会这样，我错过了什么吗？ Will deeply appreciate your help.将深深感谢您的帮助。 Thanks in advance.提前致谢。

Answer 1

Your form, the excerpt below has no <input /> elements.您的表单，下面的摘录没有<input />元素。

<form method="POST" action="/NationalPark">  
                <img class="card-img-top" src=<%=nationalParks[k].imageurl %> alt="Card image cap">


                <h5 class="card-title" name="parktitle" id="title"><%=nationalParks[k].nationalPark %></h5>

                  <button type="submit" class="btn btn-primary btn-sm"">View Page</button>

                </form>

So no data is posted back to the app.因此，不会将任何数据发回应用程序。

Adding an input element example添加输入元素示例

<Input type="hidden" name="park_name" value=<%=nationalParks[k].nationalPark %> />

In your form would make the attribute req.body.park_name available in app.js在您的表单中将使属性req.body.park_name在 app.js 中可用

Req.body 在 Node Js 中为空

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-05-06 04:20:13

Req.body 在 Node Js 中为空

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-05-06 04:20:13

解决方案1
0 已采纳 2020-05-06 04:20:13