Node.js将HTML表单数据存入PostgreSQL数据库失败问题排查

核心问题分析 #

• HTML表单数据无法传递：输入框<input1>、<input2>不在<form>标签内部，且未设置name属性，导致表单提交时不会携带这两个输入框的值。
• 请求体解析不匹配：后端使用bodyParser.json()解析JSON格式请求，但表单默认以application/x-www-form-urlencoded格式提交数据，无法被正确解析。
• 数据库连接重复创建：POST路由内重新实例化Client却未传入数据库配置，会导致连接失败；且无需每次请求都创建新连接，复用全局连接更高效。
• 数据库列名可能不匹配：代码中使用的列名是id_utilisateur、interviewed_named，但你描述的是id-utilisateur、interviewed-named（带横杠），PostgreSQL中这类列名需要用双引号包裹才能识别。

修正后的HTML代码 #

<div class="button-container">
    <form action="/OK" method="post">
        <div class="inner-container">
            <div class="left">
                <p>Label Form : </p>
            </div>
            <div class="right">
                <!-- 添加name属性，对应后端接收字段 -->
                <input id="input1" name="id_utilisateur" type="text" placeholder="Label "/>
            </div>
        </div>
        <div class="inner-container">
            <div class="left">
                <p>interviewed person name : </p>
            </div>
            <div class="right">
                <!-- 添加name属性，对应后端接收字段 -->
                <input id="input2" name="interviewed_named" type="text" placeholder="name "/>
            </div>
        </div>
        <button type="submit">OK</button>
    </form>
</div>

修正后的app.js代码 #

const express = require('express')
const app = express()
const { Client } = require('pg');
const bodyParser = require('body-parser');

// 解析表单默认的urlencoded格式请求体
app.use(bodyParser.urlencoded({ extended: true }));
// 保留JSON解析，兼容其他场景
app.use(bodyParser.json());

app.get('/', function(req, res) {
    res.sendFile(__dirname + '/Création-form.html');
});
app.use(express.static(__dirname + '/'));

// 全局数据库连接，复用该连接
const client = new Client({
    host: 'localhost',
    port: 5432,
    user: 'postgres',
    password: 'password',
    database: 'adalie'
});

client.connect((err) => {
    if (err) {
        console.error('数据库连接失败:', err);
    } else {
        console.log("已成功连接到数据库。");
    }
});

app.post('/OK', (req, res) => {
    const id_utilisateur = req.body.id_utilisateur;
    const interviewed_named = req.body.interviewed_named;

    // 若数据库列名是带横杠的格式，需用双引号包裹
    const query = 'INSERT INTO questionnaire ("id-utilisateur", "interviewed-named") VALUES ($1, $2)';
    const values = [id_utilisateur, interviewed_named];

    client.query(query, values, (err, result) => {
        if (err) {
            console.error('数据插入失败:', err.stack);
            res.status(500).send('数据存储失败');
        } else {
            // 跳转到本地成功页面（需自行创建success.html）
            res.redirect('/success.html');
        }
    });
});

app.listen(3000, () => {
    console.log('服务器已启动，地址：http://localhost:3000');
})

额外说明 #

1. 需在项目根目录创建success.html页面，内容为successfully stored。
2. 确认PostgreSQL中questionnaire表的列名格式，若为下划线格式（id_utilisateur），则SQL语句无需双引号。
3. 数据库连接失败时，检查用户名、密码、数据库名称是否与实际环境一致。

内容的提问来源于stack exchange，提问作者ouma