错误 403 禁止通过 ajax 请求服务器

Posted 2023-02-24

【中文标题】错误 403 禁止通过 ajax 请求服务器

【英文标题】：error 403 forbidden on server request via ajax

【发布时间】：2017-05-01 17:48:42

【问题描述】：

我正在开发一个跟踪待办事项列表并将其从服务器中提取出来的网站。 下面有两个示例 ajax 调用。任务 GET 调用工作正常，但添加 POST 不能。由于某种原因，它给了我一个 403 禁止错误，因此不执行代码。

我在看403 Forbidden error when making an ajax Post request in Django framework 我阅读了@yohn 发布的链接，但我不明白如何实施此解决方案。

var tasker = (function() 
    return 
        tasks : function( ownerId, cb ) 
            $.ajax( 
                url: "http://138.49.184.143:3000/tasker/api/"+ownerId+"?key=f725ebbc9c",
                type: 'GET',
                success: function(task) 
                    if(task)
                        var list = []
                        for(var a=0; a<task.length; a++)                   
                            var newTask = 
                                onwerId: task[a].ownderId,
                                desc: task[a].desc,
                                due: new Date(task[a].due),
                                color: task[a].color,
                                complete: task[a].complete,
                                id: task[a].id
                            ;
                            list.push(newTask);
                        
                        cb(list , null);
                    
                    else cb(null, 'error retreiving your tasks');
                ,
                error: function( xhr, status, errorThrown ) 
                    alert( "Sorry, there was a problem! "  + errorThrown );
                ,
            );      
        ,

        add : function( ownerId, task, cb ) 
            $.ajax( 
                url: "http://138.49.184.143:3000/tasker/api/"+ownerId+"?key=f725ebbc9c",
                type: 'POST',
                success: function(task) 
                    var d = new Date(task.due);
                    if(task)
                        var newTask = 
                            onwerId: task.ownderId,
                            desc: task.desc,
                            due: d,
                            color: task.color,
                            complete: task.complete,
                            id: task.id
                        ;
                        cb(newTask , null);
                    
                    elsecb(null, 'error adding your task');
                ,
                error: function( xhr, status, errorThrown ) 
                    alert( "Sorry, there was a problem! "  + errorThrown );
                ,
            );            
        ,
           

)();

【参考方案1】：

Django 在发出 POST 请求时需要 csrf 令牌（除非您使用基于令牌的身份验证，但我假设您不在这里）。就像您需要在表单提交中包含 csrf_token 一样。

有关您需要它的原因和 csrf 令牌用途的更多信息：What is a CSRF token ? What is its importance and how does it work?

因此，对于您的问题，请将add 下的 ajax 调用更改为：

$.ajax( 
        url: "http://138.49.184.143:3000/tasker/api/"+ownerId+"?key=f725ebbc9c",
        type: 'POST',
        data:  csrfmiddlewaretoken: ' csrf_token ', // added csrf token.
        success: function(task) 
            var d = new Date(task.due);
            if(task)
                var newTask = 
                    onwerId: task.ownderId,
                    desc: task.desc,
                    due: d,
                    color: task.color,
                    complete: task.complete,
                    id: task.id
                ;
                cb(newTask , null);
            
            elsecb(null, 'error adding your task');
        ,
        error: function( xhr, status, errorThrown ) 
            alert( "Sorry, there was a problem! "  + errorThrown );
        ,
    );