Nodejs jade 模板 post发送不出去问题

Nodejs jade 模板 post发送不出去问题

这是jade模板

h1 new User

from(method=“POST”,action="/users")

p Name: input#name(type=“text”, name=“name”) p Email: input#email(type=“email”, name=“email”) p Age: input#age(type=“number” ,name=“age”) p: button(type=“submit”) Create

这是处理的方法

app.post('/users/',function(req,res){
var b = req.body;
new Users({
	name:b.name,
	email:b.email,
	age:b.age
}).save(function(err,user){
	if(err) res.json(err);
	res.redirect('/users/'+user.name);

});

}); 点击了 什么错误提示都没 enter image description here


5 回复

Node.js Jade 模板 POST 发送不出去问题

问题描述

使用 Node.js 和 Jade 模板引擎时，尝试通过表单提交数据到服务器，但提交按钮点击后没有任何响应。

示例代码

Jade 模板代码

首先，让我们检查一下 Jade 模板中的表单定义。确保表单的 method 和 action 属性正确设置，并且所有输入字段都有正确的 name 属性。

h1 New User
form(method="POST", action="/users")
  p Name:
    input#name(type="text", name="name")
  p Email:
    input#email(type="email", name="email")
  p Age:
    input#age(type="number", name="age")
  p
    button(type="submit") Create

上述代码中，表单的 method 属性应为 "POST"，action 属性指向 /users 路由。确保每个输入字段都有相应的 name 属性，这样服务器端可以正确获取这些值。

Node.js 处理代码

接下来，我们来看一下服务器端如何处理这个 POST 请求。

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

// 使用中间件解析请求体
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/users', function(req, res) {
  var user = req.body;

  // 创建新的用户实例并保存到数据库
  new Users({
    name: user.name,
    email: user.email,
    age: user.age
  }).save(function(err, user) {
    if (err) {
      console.error(err);
      res.status(500).json({ error: 'Failed to create user' });
    } else {
      res.redirect('/users/' + user.name);
    }
  });
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

解决方案

  1. 检查表单提交

    • 确保表单的 method 和 action 属性正确。
    • 确保每个输入字段都有 name 属性。

  2. 使用中间件解析请求体

    • 在服务器端，必须使用 body-parser 中间件来解析请求体。在上面的代码中，我们使用了 bodyParser.urlencoded({ extended: true }) 来解析表单数据。

  3. 检查服务器端日志

    • 如果表单提交没有响应，检查服务器端的日志输出，看是否有错误信息。这有助于确定问题所在。

  4. 验证路由配置

    • 确保路由配置正确，没有拼写错误或遗漏。

通过以上步骤，你应该能够解决 Node.js 和 Jade 模板中 POST 表单提交的问题。如果问题仍然存在，请检查网络请求是否正确发送到服务器，并查看浏览器开发者工具中的网络请求部分。


哎。。发现了是form不是from

第一眼就。。。

#form#

1

根据你提供的信息，看起来你的问题可能与表单数据提交有关。默认情况下，Jade模板引擎会生成HTML5表单，但如果没有正确设置中间件来解析请求体中的数据（尤其是对于POST请求），则服务器端可能无法获取到表单提交的数据。

为了解决这个问题，你需要确保在你的Node.js应用中安装并使用body-parser中间件。这将帮助解析HTTP请求体中的JSON或URL编码的数据。

解决方案

首先，确保你已经安装了body-parser：

npm install body-parser --save

然后，在你的应用中使用它：

const express = require('express');
const bodyParser = require('body-parser');

const app = express();

// 使用body-parser中间件
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

// 其他路由定义
app.get('/', (req, res) => {
    res.send(`
        h1 New User
        form(method="POST", action="/users")
            p Name:
            input#name(type="text", name="name")
            p Email:
            input#email(type="email", name="email")
            p Age:
            input#age(type="number" ,name="age")
            p: button(type="submit") Create
    `);
});

app.post('/users', function (req, res) {
    var b = req.body;
    // 简化逻辑用于测试
    console.log(b); // 应该输出 { name: '... ', email: '... ', age: '...' }
    
    // 假设Users是一个Mongoose模型
    new Users({
        name: b.name,
        email: b.email,
        age: b.age
    }).save(function (err, user) {
        if (err) {
            res.status(500).json(err);
        } else {
            res.redirect('/users/' + user.name);
        }
    });
});

app.listen(3000, () => console.log('App listening on port 3000!'));

这段代码首先设置了body-parser以解析请求体。接着，我们通过一个简单的GET路由渲染包含表单的HTML页面。当表单提交时，我们将收到的POST请求数据打印出来，这样你可以验证是否能接收到正确的数据。

如果上述步骤后仍然有问题，请检查是否有其他网络或服务器配置问题，例如浏览器的CORS策略阻止了请求。

回到顶部