angular - 在 Angular 2 中获取 X-CSRF-TOKEN

Question

我在我的 app.module 中使用像这样在 Angular 2 中使用 X-CSRF-TOKEN 的标准方式：

provide: XSRFStrategy, useValue: new CookieXSRFStrategy('CSRF-TOKEN', 'X-CSRF-TOKEN')

我正在使用“primeng”进行文件上传。我需要自己设置令牌，如下所示：

private onBeforeSend(event) {
     event.xhr.setRequestHeader("X-CSRF-TOKEN", tokenThatINeed);
}

我需要 Angular2 为我生成的令牌。我不知道如何访问令牌。

Answer 1

您可以使用以下代码获取您的令牌

document.cookie

Answer 2

像这样使用HttpXsrfTokenExtractor：

export class MyComponent {

    constructor(csrfTokenExtractor: HttpXsrfTokenExtractor) {
        console.log(csrfTokenExtractor.getToken());
    }
}

Answer 3

因此，我遇到了类似的问题，并使用了 3rd 方 javascript 库来解决问题。有几个不同的，但我使用了 angular2-cookie。一旦你将服务注入到你的组件中，它就非常简单了。这是我的代码最终的样子：

import {CookieService} from "angular2-cookie/core";

@Component({
    selector: 'fileUpload',
    templateUrl: 'app/components/files/fileUpload.html',
    providers: [CookieService]

})

export class FileUploadComponent {
    uploadUrl:string;

    constructor(private propertyService:PropertyService,
                private cookieService:CookieService){

        this.uploadUrl = propertyService.getProperties().server_location + "/files/upload"
    }

    onBeforeSend(event:any){
        event.xhr.open("POST", this.uploadUrl, true);
        event.xhr.setRequestHeader("X-XSRF-TOKEN", this.cookieService.get("XSRF-TOKEN"));
    }
}