Ajax 响应重定向

Question

我遇到的问题是我做了 ajax 请求，我的 django 视图处理视图和 return JsonResponse，其内容将替换旧内容。不幸的是，响应不会替换旧内容 - 我在内容上得到重定向，页面看起来像：

{"content": "<h3>\u0421\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u043e</h3>\n<div>\n    <a href=\"/\">\u0412\u0435\u0440\u043d\u0443\u0442\u044c\u0441\u044f \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443</a>\n</div>", "success": true}

js:

$( '#main' ).on( 'click', '#submit', function() {
    $form = $( '#form' );
    $.ajax({
        type: $form.attr('method'),
        dataType: "JSON",
        url: $form.attr('action'),
        data: {
            form: $form.serialize()
        }
    }).done( function( response ) {
        console.log('ok');
        $( '#old' ).remove();
        $( '#contact' ).append(response.content);
    })
});

查看：

     ...
                content = render_to_string('mock.html')
                return JsonResponse({
                    'success': True,
                    'content': content
                })
...

我该如何解决？

Answer 1

你试过这个吗：

$( '#contact' ).html(response.content);

你想替换成什么？

Answer 2

我相信你需要做这样的事情：

$('#form').on('submit', function(event){
    event.preventDefault();
    $form = $('#form');
    $.ajax({
        type: $form.attr('method'),
        dataType: "JSON",
        url: $form.attr('action'),
        data: {
            form: $form.serialize()
        }
    }).done( function( response ) {
        console.log('ok');
        $( '#old' ).remove();
        $( '#contact' ).append(response.content);
    })
});

您需要阻止表单提交。

另一种方法可能是使用 jQuery Form Plugin

接下来您应该做的是将 CSRFToken 添加到您的 Ajax header，更多关于此 here

Answer 3

如果是 post，请确保将 csrfmiddlewaretoken 与 ajax 请求一起发送。否则你会得到一个 403 和可能的重定向。

对此进行测试的一种快速方法是将 @csrf_exempt 装饰器添加到您的视图中。

Ajax 响应重定向

Ajax response redirect

jquery

ajax

django

jsonresponse