我如何发送 CSRF 令牌

Question

我正在尝试发送登录详细信息，但响应错误是显示 csrf 令牌丢失。我如何从 angular 2
发送 csrf 令牌后端 Django。

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Cookie } from 'ng2-cookies'; 
import  'rxjs/add/operator/map';

@Injectable()
export class AuthenticationService {
    constructor(private http: HttpClient){}

    login(username:string,password:string){
        return this.http.post<any>('/api/auth',{username:username,password:password},)
            .map(user => {
                //login successful if there a jwt token in the response
                if(user && user.token){
                    localStorage.setItem('currentUser',JSON.stringify(user));
                }
                return user;
            })
    }

    logout(){
        //remove user from local storage to log user out 
        localStorage.removeItem('CurrentUser');
    }
}

Answer 1

后端和前端都必须在这方面协同工作。当以任何方式在后端启用 CSRF 时，这基本上意味着每个请求都应该通过每个 HTTP 请求中的 HTTP header 向服务器端发送一个唯一的（不完全是唯一的，稍后会详细介绍）标识符.

因此客户端（在本例中为angular）必须知道 HTTP header 的名称并且必须设置该 header 的值。

此 HTTP header（或有效的 CSRF 令牌）的值是棘手的部分。通常要设置它，客户端会不断调用服务器端 /csrf 类型的 API 并使用有效凭据来获取此值并将其设置在全局变量中（所有此类 /csrf 调用通常会定期进行，例如 15- 30 秒。唯一性的实现留给服务器）。或者为简单起见，CSRF 令牌值仅在用户登录时设置一次，并且整个 session.

都保留在客户端

然后，此 CSRF 令牌作为 HTTP header 的值与来自客户端的每个 HTTP 请求一起发送。服务器通过读取 header 并让 HTTP 请求通过来验证 CSRF 令牌。

请注意，以上所有内容也可以通过 cookie 而不是 HTTP header。

行动项目：

与您的后端团队合作，了解 CSRF 令牌的 HTTP header 名称以及设置其值的策略。或者如果不是 HTTP header.
查看如何通过 angular js 以标准化方式设置：Django csrf token + Angularjs and AngularJS + Django Rest Framework + CORS ( CSRF Cookie not showing up in client ) (Django) and How to add csrf token to angular 2 application (Spring )
阅读更多关于 CSRF 的信息：https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF) and at https://dzone.com/articles/cross-site-request-forgery

我如何发送 CSRF 令牌

How can i send a CSRF Token

javascript

csrf

angular2-routing