Menu
How does Angular (2) handle XSS and CSRF. Does it even handle these attacks? If so, what do I have to do to use this protection? If not, do I have to handle all these attacks in my server, or somehow with TypeScript in the frontend?
I have read that you have to use "withCredentials: true", but I'm not quite sure where to put this code or if it is even that, what I'm looking for.
In the https://angular.io/ webpage I didn't find anything about this (or I just missed it).
772
To systematically block XSS bugs, Angular treats all values as untrusted by default. When a value is inserted into the DOM from a template binding, or interpolation, Angular sanitizes and escapes untrusted values.
If your application uses Angular, CSRF protection comes built-in. Angular is a front-end framework that uses TypeScript. It became popular in enterprise applications where consistent design pattern is crucial to productive development. Paired with a back-end framework, Angular provides built-in CSRF protection.
Another instance where XSS attacks can happen in Angular is when you use native web APIs to directly access the DOM elements. In this case, you might use ElementRef to access a DOM element in your application as shown below.
Angular2 provides built-in, enabled by default*, anti XSS and CSRF/XSRF protection.
The DomSanitizationService takes care of removing the dangerous bits in order to prevent an XSS attack.
The CookieXSRFStrategy class (within the XHRConnection class) takes care of preventing CSRF/XSRF attacks.
*Note that the CSRF/XSRF protection is enabled by default on the client but only works if the backend sets a cookie named XSRF-TOKEN with a random value when the user authenticates. For more information read up about the Cookie-to-Header Token pattern.
UPDATE: Official Angular2 security documentation: https://angular.io/docs/ts/latest/guide/security.html (Thanks to Martin Probst for the edit suggestion!).
154
For mentioned server side in Angular, the CSRF you might handle using Express:
app.use(express.csrf()) app.use(function (req, res, next) { res.cookie('XSRF-TOKEN', req.session._csrf); res.locals.csrftoken = req.session._csrf; next(); }) Not sure if with the new HttpClientXsrfModule it's still required though. It might be enough to add only the following (but need to be confirmed) on the client side in app.module:
HttpClientXsrfModule.withOptions({ cookieName: 'XSRF-TOKEN', headerName: 'X-XSRF-TOKEN' }) If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
