Node.js原生服务器POST请求无法回复客户端问题求助

问题分析 #

你的代码核心问题是服务器响应逻辑时机错误：response.write和response.end写在了request.on("end")回调外部，而请求数据的接收是异步过程，这会导致服务器还没拿到登录数据、未完成校验就提前返回了响应。另外客户端缺少响应接收逻辑，且未设置正确的请求头。

修改后的服务器代码 #

const http = require('http'); // 原代码遗漏http模块导入

const server = http.createServer(function(request, response) {
    // 配置CORS头，解决跨域问题（若客户端与服务器不在同一域名下）
    response.setHeader('Access-Control-Allow-Origin', '*');
    response.setHeader('Access-Control-Allow-Methods', 'POST, OPTIONS');
    response.setHeader('Access-Control-Allow-Headers', 'Content-Type');

    // 处理OPTIONS预请求
    if (request.method === 'OPTIONS') {
        response.end();
        return;
    }

    if (request.method === 'POST') {
        const chunks = [];
        request.on("data", (chunk) => {
            chunks.push(chunk);
        });
        request.on("end", () => {
            try {
                // 解析客户端发送的JSON数据
                const loginData = JSON.parse(Buffer.concat(chunks).toString());
                console.log('收到登录数据:', loginData);

                // 模拟用户名密码校验逻辑
                const isValid = loginData.username === 'admin' && loginData.password === '123456';

                // 设置响应头为JSON格式
                response.setHeader("Content-Type", "application/json");
                // 返回校验结果
                response.end(JSON.stringify({
                    success: isValid,
                    message: isValid ? '登录成功' : '用户名或密码错误'
                }));
            } catch (err) {
                // 处理JSON解析错误
                response.writeHead(400);
                response.end(JSON.stringify({
                    success: false,
                    message: '请求格式错误'
                }));
            }
        });
    } else {
        // 处理非POST请求
        response.writeHead(404);
        response.end(JSON.stringify({
            success: false,
            message: '仅支持POST请求'
        }));
    }
})

const port = 3300
const host = '0.0.0.0'; // 替换为你的实际主机地址，0.0.0.0表示监听所有网卡
server.listen(port, host)
console.log(`Listening at http://${host}:${port}`)

修改后的客户端代码 #

const Http = new XMLHttpRequest();
const url='http://你的服务器地址:3300'; // 替换为实际服务器地址

// 监听服务器响应
Http.onload = function() {
    if (Http.status >= 200 && Http.status < 300) {
        const response = JSON.parse(Http.responseText);
        // 根据响应结果处理页面逻辑
        if (response.success) {
            alert('登录成功！');
            // 可添加跳转首页等操作
        } else {
            alert(response.message);
        }
    } else {
        alert('请求失败，请稍后重试');
    }
};

// 处理网络错误
Http.onerror = function() {
    alert('网络错误，无法连接服务器');
};

Http.open("POST", url);
// 设置请求头，告知服务器发送的是JSON数据
Http.setRequestHeader("Content-Type", "application/json");
// 发送登录数据（假设Id、Pw是页面输入框元素）
Http.send(JSON.stringify({username: Id.value, password: Pw.value}));

关键说明 #

1. 异步逻辑处理：必须把响应逻辑放在request.on("end")回调内，确保拿到完整请求数据后再执行校验和响应。
2. 数据解析：用Buffer.concat(chunks)拼接请求数据，避免直接chunks.toString()可能导致的编码问题。
3. 请求头配置：客户端需设置Content-Type: application/json，服务器才能正确解析JSON；添加CORS头解决跨域问题（按需配置）。
4. 响应格式：用JSON返回结果，便于客户端解析处理，比纯文本更规范。
5. 错误处理：添加JSON解析错误、请求方法错误、网络错误的处理逻辑，提升代码鲁棒性。

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