API cookie problems - trying to create XSRF/CSRF token in angular - angularjs

Question

My Web API method for initializing a session is successfully returning a cookie. The front end is in angular so I'm calling the cookie XSRF-TOKEN because angular says it will take that and turn it into a header called X-XSRF-TOKEN in all subsequent requests.
For reference the Web API GET controller method that creates the cookie looks like
...
HttpResponseMessage resp = new HttpResponseMessage() {
Content = new JsonContent(results)
};
if (results.Token != null) {
var cookie = new CookieHeaderValue("XSRF-TOKEN", results.Token);
cookie.Expires = DateTimeOffset.Now.AddDays(365);
cookie.Domain = Request.RequestUri.Host;
cookie.Path = "/";
cookie.HttpOnly = false;
resp.Headers.AddCookies(new CookieHeaderValue[] { cookie });
}
return resp;
...
Using Fiddler I can see the cookie in the response. Now I'm expecting 2 things
all subsequent API calls to that same domain should include this cookie in the request header
Angular should be adding the X-XSRF-TOKEN header I mentioned earlier
Neither one is happening (I'm checking with Fiddler). I've tried with the site and API in the same domain (like localhost) and in different domains.
Some sources I've checked:
https://docs.angularjs.org/api/ng/service/$http
https://stormpath.com/blog/angular-xsrf
I also tried adding
$httpProvider.xsrfWhitelistedOrigins = [webServicesPath];
where webServicesPath is a variable I use for the API path but it makes no difference.

Answer 1

You should use something like following
public void Configure(IApplicationBuilder app, IAntiforgery antiforgery) {
context.Response.Cookies.Append("XSRF-TOKEN", tokens.RequestToken, new CookieOptions() { HttpOnly = false });
}
public void ConfigureServices(IServiceCollection services) {
// Angular's default header name for sending the XSRF token.
services.AddAntiforgery(options => options.HeaderName = "X-XSRF-TOKEN");
}