req.body 不起作用我无法在 javascript 中使用 express 从 POST 接收数据

req.body not working I can't receive data from POST with express in javascript

提问人:Flacuchentxox 提问时间:9/10/2023 更新时间:9/10/2023 访问量:52

问:

这是我第一次在 nodeJS 中构建快速服务器,我不知道我在做什么,但我设法使用路由和控制器制作 POST 和 GET......我不知道为什么 req.body 在终端上显示 {},显然我没有从 AJAX 接收任何数据,但为什么?请帮忙。

服务器.js

const express = require('express');
const morgan = require('morgan');
const path = require("path");
const mysql = require('mysql');
const myConnection = require('express-myconnection');
const app = express();
const bodyParser = require('body-parser');
// Manejar solicitudes JSON
app.use(express.json());


// Configuración de acceso a la base de datos
const hostDB = "localhost";
const userDB = "root";
const passwordDB = "";
const portDB = 3306;
const databaseDB = 'motionpose';

// Importación de rutas
const usuarioRuta = require('./routes/usuarios');
const registroRuta = require('./routes/registroRuta');
// Configuración
app.set('port', process.env.PORT || 5555);

// Middlewares
app.use(morgan('dev'));
app.use(myConnection(mysql, {
    host: hostDB,
    user: userDB,
    password: passwordDB,
    port: portDB,
    database: databaseDB
}, 'single'));

// Rutas
app.use('/login', usuarioRuta); 
app.use('/registro', registroRuta);
// Archivos estáticos
app.use(express.static('public'));

// API
app.get('/', (req, res)=>{
    res.sendFile(path.join(__dirname, 'view', 'index.html'))
}); 

app.listen(app.get('port'), ()=>{
    console.log('Server corriendo en puerto: ' + app.get('port'));
});

usuarios.js

const express = require('express');
const router = express.Router();
const bodyParser = require('body-parser'); // Importa body-parser
const usuariosController = require('../controllers/usuariosController');

router.use(bodyParser.urlencoded({ extended: false }));
router.use(bodyParser.json());
router.get('/', usuariosController.view);
router.post('/', usuariosController.post);
module.exports = router;

登录.js

$(document).ready(function(){
    
    $("#continuarBoton").on("click", function(){
        var formData = new FormData();
        formData.append("correo", $("#correo").val());
        formData.append("contrasena", $("#contrasena").val());
        $.ajax({
            url: '/login', // Reemplaza con la ruta correcta hacia tu función getUsuarios
            method: 'POST',
            dataType: 'json',
            data: {
                correo: "test1",
                contrasena: "test2"
            },
            processData: false,
            contentType: false,
            success: function(data) {
                console.log(data);
                if(data.Exito){
                    console.log("Solicitud POST exitosa");
                }else{
                    console.error("Solicitud POST DENEGADA");
                }
                
            },
            error: function(error) {
                console.error(error);
            }
        });
    });
});

usuarios控制器.js

const controller = {};
const path = require('path');
let usuariosLista = [];
let Exito;
controller.view = (req, res)=>{
    res.sendFile(path.join(__dirname, '..', 'view', 'login.html'));
    Exito = true;
};
controller.post = (req, res) => {
    console.log("This is working");
    console.log(req.body);
    res.json({Exito: Exito});
}

module.exports = controller;

端子输出:

This is working
{}
POST /login 200 3.802 ms - 14

我希望从 AJAX 控制台 .log 数据。 我在打印 req.body 时收到 {},或者在我尝试访问特定值(例如 req.body.correo)时收到 undefined。

我已经安装了body-parser。

JavaScript 节点.js ajax express

评论

1赞 Quentin 9/10/2023
考虑不使用 jQuery;几十年前,当原生浏览器 API 不是很好时,它做得很好,但时代已经变了。
0赞 Flacuchentxox 9/10/2023
你是对的,但我已经知道如何使用jquery,学习纯javascript让我很懒惰,但总有一天我会做到的!

答:

1赞 Quentin 9/10/2023 #1

你说:

router.use(bodyParser.urlencoded({ extended: false }));
router.use(bodyParser.json());

因此,如果您收到一个请求,其中数据编码为 JSON 或使用 URL 表单编码,并且请求具有匹配的标头,则将填充该请求。req.bodyContent-Type


然后你说:

data: {
    correo: "test1",
    contrasena: "test2"
},

您正在将对象传递给 jQuery。

正常情况下,它会将其编码为 URL 表单编码数据设置正确的内容类型。


但是,你也说:

processData: false,

...它告诉jQuery不处理传递给的值,以便它命中基础对象并转换为字符串(这是无用的)。dataXMLHttpRequest[object Object]

你还说:

contentType: false,

...它告诉jQuery不要设置content-type,并让它弄清楚(它将设置为)。XMLHttpRequesttext/plain

删除这两个参数


如果要发送 JSON,则需要:

  • 将 JSON 传递给data
  • 显式设置 content-type
    data: JSON.stringify({
        correo: "test1",
        contrasena: "test2"
    }),
    contentType: 'application/json',

仍然不应该设置,因为jQuery首先不对字符串进行处理。processData: false,


旁白

我已经安装了body-parser。

别这样。

Express 依赖于 body-parser,并通过 express 对象公开它。让它管理您使用的正文解析器版本,而不是手动执行。

请改用 express.json 和 express.urlencoded

评论

0赞 Flacuchentxox 9/10/2023
朋友,你是救命恩人,你对 ajax 查询的看法完全正确,事实上我从另一个旧项目中复制了那个 ajax,因为我忘记了结构,只是那些行困扰着我,非常感谢。