3

我尝试将 200 OK 响应发送回 chrome 浏览器，但浏览器没有像我预期的那样做出反应，他清理屏幕而不是更改特定的“div”，这是我的代码：

我的服务器：（node.js）：

    function postHandler(request, response) {
    request.on('data', function(data) {
        body += data;
        var parseBody = queryString.parse(body);
        
        response.writeHead(200, {"Content-Type": "text/plain"});
                response.end("<div>divi</div>");
    });
    response.on('end', function() {
        console.log("End_Body: " + body);
    });
}

我的 JavaScript 浏览器 ajax 调用看起来像：

$(document).ready(function() {
$("#register_form").ketchup();

var request;
$("#submit_btn")
    .on('click',function() {

        var username = $('#reg_username').val();
        var password = $('#reg_password').val();
        var firstname = $('#firstname').val();
        var lastname = $('#lastname').val();
        var age = $('#age').val();

        request = $.ajax({ url: "/welcome.html",
            type: "POST",
            
            data: {
                'username': username,
                'password': password,
                'firstname': firstname,
                'lastname': lastname,
                'age': age
            }});

        request.done(function (response, textStatus, jqXHR){
            $("#server_answer").text("success");
        });
        request.fail(function (jqXHR, textStatus, errorThrown){
            $("#server_answer").text("fail");


           });

        });
});

我究竟做错了什么？

4

4 回答 4

1

尽量不要从 on 'data' 发送响应，而是从 on 'end'... 在客户端，尝试使用 success 方法。

尝试以下操作...在服务器中：

function postHandler(request, response) {
var body = '';
//when the request comes with some body
request.on('data', function (data) {
        body += data;
        // 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB 
        if (body.length > 1e6) { 
            // FLOOD ATTACK OR FAULTY CLIENT, NUKE REQUEST
            request.connection.destroy();
        }
    });

//when the request is finished. (maybe it's data is long and its takes time)
request.on('end', function () {
      console.log("End_Body: " + body);
      response.writeHead(200, { 'Content-Type': 'text/plain'});
      response.write('<div>divi</div>'); 
      response.end();
    });//end of 'end' event
}

请注意，在这里您实际上忽略了正文（我试图尽可能靠近您的代码）...

在客户端：

$(document).ready(function() {
    $("#register_form").ketchup();

    $("#submit_btn").on('click',function() {
        var username = $('#reg_username').val();
        var password = $('#reg_password').val();
        var firstname = $('#firstname').val();
        var lastname = $('#lastname').val();
        var age = $('#age').val();

        $.ajax({ url: "",
                 type: "POST",
                 data: {'username': username,
                        'password': password,
                        'firstname': firstname,
                        'lastname': lastname,
                        'age': age},
                 success: function(data) {//on success
                      $("#server_answer").text("success");
                 },
                 fail: function (jqXHR,textStatus,errorThrown){ // when the ajax call fails
                      $("#server_answer").text("fail");

                 }
        }); //of ajax
    });//of on 'click'
});

请注意，我删除了 url ( put '' 代替) 所以它的默认值是本地主机......你这样做的方式是你实际上将 post 请求发送到 '/welcome.html' 但这不是你处理这些请求的地方(可能在 server.js 或其他东西上 - 这是你的本地主机）

我用了一些

于 2013-07-25T18:13:45.530 回答
1

我没有执行你的代码，但我的猜测是当你的点击处理程序结束时你的页面会刷新。

尝试return false;在点击处理程序的末尾添加。

于 2013-07-25T19:27:36.480 回答
1

正如 Zohar Yahav 提到的，请尝试以下操作：

statusCode: {
200: function() {
alert('whatever');
}},

不要忘记..

return false
于 2013-07-25T22:08:04.997 回答
0

您可以通过以下更改进行测试。在服务器中：

function postHandler(request, response) {
    request.on('data', function(data) {
        body += data;
    });
    request.on('end', function() {
        var parseBody = queryString.parse(body);

        response.writeHead(200, {"Content-Type": "text/plain"});
                response.end("<div>div</div>");
        console.log("End_Body: " + body);
    });
}

在浏览器上

request.done(function(msg) {
    $("#server_answer").text("success");
});

request.fail(function(jqXHR, textStatus) {
    $("#server_answer").text("fail");
});

done您为和提供的参数用于ajax 调用中给出fail的success和处理程序。error

于 2013-07-25T17:49:39.553 回答