Django + Angular 5 开发设置 CSRF 处理

Question

在 CSRF 验证方面，我当前的开发设置有点问题。由于我是运行一个 angular 开发服务器和一个 django 开发服务器并排并且（自然地）需要向后端发送请求，CSRF 成为一个问题。 Django 通常在用户连接时分发令牌，但现在前端和后端如此断开连接，我无法以自然方式获得 CSRF 令牌。

我现在尝试的是添加一个 @csrf_exempt 装饰函数来获取 cookie，也通过使用 @ensure_csrf_cookie 装饰该函数。我遇到的问题是，仍然在为包含 CSRF 令牌的请求设置适当的 header 时，服务器仍然 returns 给我一条消息，说没有包含 CSRF cookie（废话！）。

所以，我的问题首先是如何为 CSRF 令牌正确设置 header，这就是我目前的做法（下面的打字稿）：

  constructor(private httpClient: HttpClient) {
    const cookies = document.cookie.split(';');
    for (let cookie of cookies) {
      cookie = cookie.trim();
      const re = new RegExp('^csrftoken');
      if (re.test(cookie)) {
        this.csrfToken = cookie;
        // this.csrfToken = cookie.substr(10, cookie.length);
        break;
      }
    }
    console.log('[RequestService] Got token: ' + this.csrfToken);
  }

  post(url: string, body: {}) {
    return this.httpClient.post(url, body, { headers: new HttpHeaders({ 'x-csrftoken': this.csrfToken }) });
  }

如上所示，我已经注释掉了提取cookie的一部分。评论部分将删除初始 'csrftoken=' 并保留令牌本身。我应该 trim 去掉 'csrftoken=' 部分还是留在那里？

这是我想用来获取更新的 cookie 的 django 视图：

@csrf_exempt
@ensure_csrf_cookie
def get_csrf_token(request):
    return HttpResponse(status=200)

请求通过函数，但是当我手动检查我拥有的当前 cookie 时 document.cookies 我发现它仍然是没有更新的旧 cr脚 cookie :(.

我考虑过使用 django 中的 CSRF_USE_SESSIONS 设置来强制每个请求发送更新的 CSRF，但这对于这样一个简单的问题来说似乎有点过分了。

请指教！

Answer 1

答案在于我需要在我的 http 请求上设置另一个选项。该请求有另一个名为 withCredentials 的选项字段，需要将其设置为 true 以包含 CSRF 信息。

我还需要对我得到的 cookie 进行子字符串化，以便只包含 CSRF 令牌而不带前缀 "csrftoken="，这是在我提取它的构造函数内的注释行中完成的。

Django + Angular 5 开发设置 CSRF 处理

Django + Angular 5 development setup CSRF handling

django

cookies

csrf

web-development-server

angular