AngularJS Directive
module AngularApp {
"use strict";
export function antiForgeryToken($http: ng.IHttpService): ng.IDirective {
return (scope, element, attrs) => {
$http.defaults.headers.common['RequestVerificationToken'] = attrs.antiForgeryToken || "no request verification token";
};
}
antiForgeryToken.$inject = ['$http'];
}
MVC Html helper method
public static class AntiForgeryExtension {
public static string RequestVerificationToken(this HtmlHelper helper) {
return String.Format("anti-forgery-token={0}", GetTokenHeaderValue());
}
private static string GetTokenHeaderValue() {
string cookieToken, formToken;
System.Web.Helpers.AntiForgery.GetTokens(null, out cookieToken, out formToken);
return cookieToken + ":" + formToken;
}
}
Print directive with generated anti-forgery token to your view
<form id="registration" @Html.RequestVerificationToken()>
...
</form>
Web API validate attribute
ATTN! Be sure to use System.Web.Http.Filters.ActionFilterAttribute, not System.Web.Mvc.ActionFilterAttribute!
using System.Linq;
using System.Web;
using System.Web.Helpers;
using System.Web.Http.Controllers;
using System.Web.Http.Filters;
namespace MyNamespace {
public class ValidateAntiForgeryAngular : ActionFilterAttribute {
public override void OnActionExecuting(HttpActionContext filterContext) {
var headers = filterContext.Request.Headers;
string cookieToken = null;
string formToken = null;
var rvt = headers.GetValues("RequestVerificationToken").FirstOrDefault();
if(rvt != null) {
string[] tokens = rvt.Split(':');
if(tokens.Length == 2) {
cookieToken = tokens[0].Trim();
formToken = tokens[1].Trim();
}
}
AntiForgery.Validate(cookieToken, formToken);
}
}
}
Web API method
[ValidateAntiForgeryAngular]
public void PostSomething(MySomething something)
{
//some code here
}
Reuse
Just add this somewhere in your template @Html.RequestVerificationToken()
and the action filter attribute [ValidateAntiForgeryAngular]
above your Web API method.