Django - 使用 ExtJS 发布 ajax 请求禁止 403

Posted 2023-02-19

【中文标题】Django - 使用 ExtJS 发布 ajax 请求禁止 403

【英文标题】：Django - Post ajax request forbidden 403 with ExtJS

【发布时间】：2014-01-25 09:58:20

【问题描述】：

我正在使用 ExtJs 创建一个按钮，用于向我的 django 应用程序发送 ajax 帖子，但该帖子被 FORBIDDEN (403) 错误阻止。

我尝试通过将自定义 X-CSRFToken 标头设置为 CSRF 令牌 (https://docs.djangoproject.com/en/1.3/ref/contrib/csrf/#ajax) 的值来将 CSRF 令牌作为 POST 数据传递，但没有成功

ExtJS.js

        action =  new Ext.Button(
            text: 'Ajax Test',
            handler: function () 
                Ext.Ajax.request(
                        url: 'test/',
                        method: 'POST',
                        headers:  'Content-Type': 'application/json',
                        params: 'test': 'test',
                        success: function(response, opts) 
                                var obj = Ext.decode(response.responseText);
                                console.dir(obj);
                                ,
                        failure: function(response, opts) 
                                console.log('server-side failure');
                                
                );
            ,
         );

view.py

def test(request):
    print "TEST WORKING"
    print dict(request.POST.copy().iteritems())
    return HttpResponse("")

---

Chrome 网络选项卡：

回复：

CSRF verification failed. Request aborted.

Cookie：

Request Cookies:
csrftoken  :  S7uLgmhqeprWqL4NdH9mznIfpTgyM9RP
djdt  :  hide
djdttop  :  30
sessionid  :  sx4ukmkitqp39wvuve1a9zed2kjiwfb1

Response Cookies:
(empty)

标题：

Request URL:http://127.0.0.1:8000/basqui/layer/edit/2/test/
Request Method:POST
Status Code:403 FORBIDDEN
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:9
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Cookie:sessionid=sx4ukmkitqp39wvuve1a9zed2kjiwfb1; csrftoken=S7uLgmhqeprWqL4NdH9mznIfpTgyM9RP; djdttop=30; djdt=hide
Host:127.0.0.1:8000
Origin:http://127.0.0.1:8000
Referer:http://127.0.0.1:8000/basqui/layer/edit/2
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/31.0.1650.63 Safari/537.36
X-Requested-With:XMLHttpRequest
Form Dataview sourceview URL encoded
test:test
Response Headersview source
Content-Type:text/html
Date:Tue, 07 Jan 2014 16:52:15 GMT
Server:WSGIServer/0.1 Python/2.7.5
X-Frame-Options:SAMEORIGIN

【问题讨论】：

也向我们展示 django 视图..

添加 CSRF-token 是正确的解决方案，您能否再次添加它，然后执行请求并从您的浏览器开发工具网络选项卡复制/粘贴帖子和响应？

通常，在添加 CSRF 令牌时，ajax 帖子正在工作。我认为它在这里不起作用，因为 ajax 是通过 extJS 初始化的

How do I include Django 1.2's CSRF token in a javascript-generated HTML form?的可能重复

@orokusaki：谢谢，那个帖子解决了我的问题

【参考方案1】：

        action =  new Ext.Button(
        text: 'Ajax Test',
        handler: function () 
            var csrf = Ext.util.Cookies.get('csrftoken');
            Ext.Ajax.request(
                    url: 'test/',
                    method: 'POST',
                    headers:  'Content-Type': 'application/json',
                    params: 'test': 'test', 'csrfmiddlewaretoken': csrf,
                    success: function(response, opts) 
                            var obj = Ext.decode(response.responseText);
                            console.dir(obj);
                            ,
                    failure: function(response, opts) 
                            console.log('server-side failure');
                            
            );
        ,
     );

【参考方案2】：

https://www.sencha.com/forum/showthread.php?134125-Django-1-3-Login-with-ExtJS-4-and-CSRF

我把它放在我的应用程序启动函数中：

Ext.require(["Ext.util.Cookies", "Ext.Ajax"], function()
    // Add csrf token to every ajax request
    var token = Ext.util.Cookies.get('csrftoken');
    if(!token)
        Ext.Error.raise("Missing csrftoken cookie");
     else 
        Ext.Ajax.defaultHeaders = Ext.apply(Ext.Ajax.defaultHeaders || , 
            'X-CSRFToken': token
        );
    
);