使用AJAX的Django POST无法正常工作

时间:2018-08-20 18:21:55

标签: ajax django python-3.x cors django-cors-headers

我有一个Django后端,其中添加了corsheader和中间件。

我有一个html页面,从该页面我将AJAX XMLHttpRequest POST发送到托管django应用程序的本地主机,但该帖子从未通过。它会触发GET事务,并且该事务永远不会到达服务器。

前端HTML页面的代码如下:-

<button type="submit" class="btn btn-success btn-lg" id="sub1" 
onClick=loadDoc() >Login </button>
<script>
                    function loadDoc() {
                        var xhttp = new XMLHttpRequest();
                        xhttp.onreadystatechange = function() {
                            if( this.readyState == 4 && this.status == 200 ) {
                                location.replace(Trial.html);
                            }
                        };
                        xhttp.open("POST", "http://localhost:XXXX/XXXX/XXXX/", true)
                        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                        xhttp.send();
                    }
</script>

谁能指出出什么问题了?当我使用表单数据时,该帖子有效,但是当我使用JavaScript时,该帖子不起作用。

1 个答案:

答案 0 :(得分:0)

发生这种情况的原因是CORS。

现代浏览器不支持跨源请求。因此,我必须下载并安装Django CORS标头模块。适当地更新设置文件,以允许来自其他来源的请求通过。

此外,AJAX / jQuery发布请求已更改为:

 $( "#loginForm" ).submit(function( event ) {
     // Stop form from submitting normally
     event.preventDefault();

     var jqxhr = $.post( "http://XXXX.com/xxxx/xxxx/", $( "#loginForm" ).serialize(), function() {
                            alert( "success" );
                      })
                            .done(function( data ) {
                                if( data == "SUCCESS") {
                                    location.replace("xxxx.html");
                                }
                                else {
                                    alert("WRONG CREDS");
                                }
                        })
                            .fail(function() {
                            alert( "error" );
                        });
                    });