Django Rest Framework + AngularJS：CSRF 保护的正确方法？

Posted 2023-02-24

【中文标题】Django Rest Framework + AngularJS：CSRF 保护的正确方法？

【英文标题】：Django Rest Framework + AngularJS: Correct way for CSRF Protection?

【发布时间】：2015-10-01 03:49:09

【问题描述】：

没有 Django Rest Framework，我曾经像这样创建表单/POST 请求：

<form id='loginForm' method="post" action="/register/">% csrf_token %
    ...
</form>

但我盯着前端使用 Django Rest Framework 和 AngularJS，我不确定如何使用 CSRF 令牌，所以我决定做一些研究。我遇到了这个网站：http://blog.kevinastone.com/getting-started-with-django-rest-framework-and-angularjs.html，如果你向下滚动到“插曲：AngularJS + CSRF 保护”部分，它说我需要添加以下脚本：

// Add the CSRF Token
var app = angular.module('example.app'); // Not including a list of dependent modules (2nd parameter to `module`) "re-opens" the module for additional configuration
app.config(['$httpProvider', function($httpProvider) 
    $httpProvider.defaults.headers.common['X-CSRFToken'] = ' csrf_token|escapejs ';
]);

然后我看到了这个 SO 帖子：Django csrf token + Angularjs 说在添加之后

django.middleware.csrf.CsrfViewMiddleware

我的 MIDDLEWARE_CLASSES 是 settings.py，我只需要添加以下几行

angular.module("myApp", [])
    .config(['$httpProvider', function($httpProvider) 
        $httpProvider.defaults.xsrfCookieName = 'csrftoken';
        $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
    ])

请注意，当我查看其他解释如何使用 DRF 和 AngularjS 进行用户身份验证/注册的 SO 帖子时（例如，此帖子：User Authentication in Django Rest Framework + Angular.js web app），答案不包括以下行：

$httpProvider.defaults.xsrfCookieName = 'csrftoken';
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';

话虽如此，使用 Django Rest Framework 和 AngularJS 添加 CSRF 保护的正确方法是什么？

【问题讨论】：

你不妨看看***.com/questions/18156452/…

@RajeshKaushik 对，我在帖子中提到了该链接。基本上，我想知道推荐的方法是什么，因为当我环顾四周时，我发现了多种方法（我链接到我在帖子中看到/阅读的不同方法）。我有点困惑，因为不同的人做的方式不同，我不确定最好的方法是什么。

抱歉，我不记得确切的设置，但我在此视频中演示了如何设置。 youtube.com/watch?v=VZ8NIoLN-yQ]'

【参考方案1】：

您的第二种方式 ($httpProvider.defaults) 可能是最好的方式。请参阅angular docs on http here。 xsrfCookieName 和 xsrfHeaderName 选项在 Angular 中相对较新。 （如果没有记错的话，我认为它们是在 1.3 中出现的……）因此，您发现的其他代码可能只是早于更新、更好的方法。无需在模板中进行渲染或转义调用 = 更简洁的代码。