避免在发布请求中重定向答案

【问题标题】：Avoid redirect in post request避免在发布请求中重定向
【发布时间】：2020-08-18 11:11:41
【问题描述】：

我正在尝试将我从后端接收到的 JSON 内容显示到前端，而不重定向到新页面。

我想避免在这个 POST 请求中重定向，但它会自动转到 URL search_results/ 并打印出 json。我怎样才能避免这种情况？

但是，它确实会在重定向之前在控制台上打印出“重定向帖子成功”。

        $(document).ready(function () {
            $.extend(
            {
                redirectPost: function(location, args)
                {
                    var form = $('<form></form>');
                    form.attr("method", "post");
                    form.attr("action", location);

                    $.each( args, function( key, value ) {
                        var field = $('<input></input>');

                        field.attr("type", "hidden");
                        field.attr("name", key);
                        field.attr("value", value);

                        form.append(field);
                    });
                    $(form).appendTo('body').submit();
                }
            });

            $("#submitButton").click(function() {
                console.log("submitButton clicked")

                $("#search_form").submit(function(e) {
                    e.preventDefault();

                    $.redirectPost("./search_results/", {

                            inheritance: $("input[name=inheritance]:checked").attr("id"),
                            penetrance: $("input[name=penetrance]:checked").attr("id"),
                            mortality: $("input[name=mortality]:checked").attr("id"),

                            success: function(response){
                                console.log("Success in redirect post!")

                                var json_results_list = response.body.results_list

                            }


                    });

                });
            });
        });

我的后端代码如下所示：

app.post('/search_results', callName)


function callName(request, response) {
//...insert serverside code..
//...set global_data to a JSON in string form
response.send(JSON.parse(global_data))
}

【问题讨论】：

一个JS叫表单提交不能用e.preventDefault取消。

标签： javascript jquery node.js json http-post

【解决方案1】：

所以基本上你想要的就是所谓的ajax。您不需要创建 redirectPost 方法，该方法将创建一个不可见的表单并提交它。只需改用$.post。

$.post("./search_results/", {
    inheritance: $("input[name=inheritance]:checked").attr("id"),
    penetrance: $("input[name=penetrance]:checked").attr("id"),
    mortality: $("input[name=mortality]:checked").attr("id")
}, function (response) {
    console.log("Success in redirect post!")
    var json_results_list = response.body.results_list

});

您可以查看更多示例here

【讨论】：