CODEWITHSUNDEEP
angularcsrf
ORE
ORE

Reputation: 143

angular4 angular2 - XSRF protection

We are currently working on an Angular4 app with Slim-PHP REST Backend. Now we want to implement XSRF protection. Is it correct that there is no official tutorial on Angular2 or Angular4, how to use the classes XSRFStrategy, CookieXSRFStrategy, etc. on the client side? (We put an XSRF TOKEN cookie on the server side and wont that angular send a XSRF TOKEN-header-parameter).

We have found many threads in forums, however, all with individual cases ... On the page "https://angular.io/guide/security" there is also no detailed information on how to use it. Or did I miss something? Does anyone have a tip?

Thanks!

Upvotes: 2

Views: 3000

Answers (2)

Pablo Lozano
Pablo Lozano

Reputation: 10342

The url that you provided has a link to the class HttpClient, where you can find the following text:

Cross-Site Request Forgery (XSRF) is an attack technique by which the attacker can trick an authenticated user into unknowingly executing actions on your website. HttpClient supports a common mechanism used to prevent XSRF attacks. When performing HTTP requests, an interceptor reads a token from a cookie, by default XSRF-TOKEN, and sets it as an HTTP header, X-XSRF-TOKEN. Since only code that runs on your domain could read the cookie, the backend can be certain that the HTTP request came from your client application and not an attacker.

This is configurable:

If your backend service uses different names for the XSRF token cookie or header, use HttpClientXsrfModule.withOptions() to override the defaults.

 imports: [   HttpClientModule,  
   HttpClientXsrfModule.withOptions({
     cookieName: 'My-Xsrf-Cookie',
     headerName: 'My-Xsrf-Header'
   }) ]

Upvotes: 2

Carlo Bos
Carlo Bos

Reputation: 3293

This should be withOptions not withConfig. I.e.: like so

HttpClientXsrfModule.withOptions({
  cookieName: 'My-Xsrf-Cookie',
  headerName: 'My-Xsrf-Header'
}),

Upvotes: 4

Related Questions