Forum Discussion
Walter_Kacynski
Cirrostratus
CirrostratusUsing ASM and CSRF with Angular
Does any one have experience using ASM CSRF with the Angular framework? I see the in normal responses for HTML that the CSRT URL parameter is appended to for subsequent requests. However, our Angular application does not have this occur. According to the docs for angular it looks, by default, for a cookie named XSRF-TOKEN on the first HTTP request and then replies with subsequent requests with an HTTP header X-XSRF-TOKEN. Is there a way to fill in the value from the default "CSRT" parameter so that Angular can find this? I can't find any docs on how CSRT is generated from ASM.
Walter, ASM CSRF protection doesn't have support for Angular. But AFAIK you can implement the CSRF protection by yourself via iRule. For example you can use hash value of the TS_Cookie as the CSRF token, give it to angular by setting the value of CSRF_TOKEN cookie and enforce the protection by verifying that the CSRF_Token HTTP Header sent by Angular does match the value of MD5 hash of the TS_Cookie. Does it makes sense?
- Walter_KacynskiIt's completely possible to modify Angular to grab the correct token to append to the URL, however, I don't know how the ASM javascript is structured so I can instruct Angular to grab the csrt token. The same does with the iRule route, how do I deliver the csrt token as a cookie or http header? It appears that csrt is generated based on some javascript algorithm.
- I'm not familiar with Angular so I will only be of limited help here. From the way I understand it, Angular is not either running the JS itself(as a client) or passing the JS onto the end-user. If there is no way for Angular to execute the JS as a client or if there is no way to pass the JS through to the client(and have Angular pass the complete responses back to ASM), then Angular is likely not compatible with ASM's CSRF protection mechanism as-is. From my limited understanding, it seems that you likely have 3 options: 1. Find out a way to execute the appropriate JS through Angular either with Angular as the client or passing it through.
 
2. Use Angular's XSRF built-in protection and not use ASM's CSRF protection. 
3. Use iRules to insert a cookie into the client-side responses that Angular could potentially understand, but the issue here is that if Angular doesn't allow the JS to get executed (either in Angular or on the client), I don't know how the iRule would know what value to insert. In addition, if the links are not appended with the appropriate query string by Angular, the iRule would have to use the incoming request header to rebuild all the links when they are requested, assuming the header existed. 
The iRules events that might be useful here are: HTTP_RESPONSE_RELEASE 
Description 
An iRule event triggered when the system is about to release HTTP data on the clientside of the connection. This event is triggered after modules process the HTTP response 
https://clouddocs.f5.com/api/irules/HTTP-RESPONSE-RELEASE.html HTTP_REQUEST 
Description 
An iRule event triggered when the system fully parses the complete client HTTP request headers (that is, the method, URI, version, and all headers, not including the HTTP request body). 
https://clouddocs.f5.com/api/irules/HTTP_REQUEST.html - Walter_KacynskiThe problem is that angular is not using the javascript that ASM is injecting in the page response. Therefore, when the next HTTP POST is sent to the server, the csrt query parm is missing which triggers the ASM block page.
- I am not sure I understand the Angular framework document you posted, but it appears to me that the XSRF functionality you are describing is basically Angular's method to prevent CSRF. In order to leverage Angular's protection, it asks for a unique cookie that the server understands, but that's all. That the cookie is generated by the server's implementation of CSRF protection is not what it seems to want. Based on that, it seems to me that Angular's XSRF-TOKEN and related are separate and independent of ASM's CSRF.
