Jhipster 4 angular 4 ng2-file-upload return 错误 403 访问被禁止，因为 CSRF

Question

ng2-file-upload 不会在上传请求的同时发送 CSRF 访问令牌，所以我收到 403 访问禁止并且我的上传请求立即被拒绝。

Answer 1

在jhipster中 angular 4、每个普通的http请求在header中都有一个X-XSRF-TOKEN，但是第三方库ng2-file-upload没有使用http我认为是内部服务。因此，当您在组件的构造函数中创建 FileUploader object 时，您应该像这样实例化它：

this.uploader = new FileUploader({url: URL, headers: [{name: 'X-XSRF-TOKEN', value: csrfService.getCSRF()}]});

其中 csrfService 是 SCSRFService 的一个实例，它位于您的项目 SharedServices 中，可以注入到您的组件中。

Answer 2

如果您的令牌更频繁地更改，您也可以根据请求设置它。在下面的示例中，CSRF 令牌是从 cookie 中获取的。这可以在您的组件构造函数中完成。

this.uploader = new FileUploader({ url: URL });
this.uploader.onBeforeUploadItem = (fileItem) => {
    fileItem.headers.push({name: 'X-XSRF-TOKEN', value: cookieService.getCookie('XSRF-TOKEN')});
    return fileItem;
};

Jhipster 4 angular 4 ng2-file-upload return 错误 403 访问被禁止，因为 CSRF

Jhipster 4 angular 4 ng2-file-upload return error 403 access forbidden becauze of CSRF

angular

spring-boot

csrf

jhipster

x-xsrf-token