如何使用 angular2 应用程序和 net core 应用程序实现 X-XSRF-TOKEN？

我在 Startup.cs 中设置了我的网络核心应用程序和防伪 middlweare：

        services.AddAntiforgery(options => options.HeaderName = "X-XSRF-TOKEN");

在ConfigureServices方法中，以及

        app.UseAntiForgeryMiddleware();

在配置方法中。

防伪中间件：

public class AntiForgeryMiddleware
    {
        private readonly IAntiforgery antiforgery;
        private readonly AntiforgeryOptions options;
        private readonly RequestDelegate next;

        public AntiForgeryMiddleware(RequestDelegate next, IAntiforgery antiforgery, IOptions<AntiforgeryOptions> options)
        {
            this.next = next;
            this.antiforgery = antiforgery;
            this.options = options.Value;
        }

        public async Task Invoke(HttpContext context)
        {
            try
            {
                if (string.Equals(context.Request.Path.Value, "/", StringComparison.OrdinalIgnoreCase) ||
                    string.Equals(context.Request.Path.Value, "/index.html", StringComparison.OrdinalIgnoreCase))
                {
                    // We can send the request token as a JavaScript-readable cookie, and Angular will use it by default.
                    var tokens = antiforgery.GetAndStoreTokens(context);
                    context.Response.Cookies.Append("XSRF-TOKEN", tokens.RequestToken, new CookieOptions() { HttpOnly = false });
                }

                if (string.Equals("POST", context.Request.Method, StringComparison.OrdinalIgnoreCase))
                {
                    await antiforgery.ValidateRequestAsync(context);

                    context.Response.StatusCode = 204;
                }
            }
            catch (Exception ex)
            {
                throw ex;
            }

            await next(context);
        }
    }

I use

[ValidateAntiForgeryToken]

在我的控制器操作上。

如何设置 angular2 post 请求来发送与 net core 应用程序匹配的 x-xsrf-token 标头？

感谢 Angular 提供的 CookieXSRFStrategy，Angular 为您完成了这部分工作。

对于 Angular，您将使用他们的 $http 服务来发送 AJAX 请求。如果该服务可以找到名称为 XSRF-TOKEN 的 cookie 形式的令牌值，则该服务将自动包含名称为 X-XSRF-TOKEN 的标头。

在 .net 端，您只需创建一些中间件来获取请求令牌，并将其值存储为 XSRF-TOKEN cookie (HttpOnly = false).

验证过程：-

1) 应用程序将向浏览器发送回带有请求令牌的 cookie XSRF-TOKEN 和带有 cookie 令牌的另一个 cookie .AspNetCore.Antiforgery.*。

2) 每当 Angular 发送 Ajax 请求时，请求将包含带有请求令牌的标头 X-XSRF-TOKEN 和带有 cookie 令牌的 cookie .AspNetCore.Antiforgery.*。

3) 防伪验证将确保两个令牌都是有效的并且共享相同的秘密等。

由于请求令牌的默认标头名称是RequestVerificationToken，我们需要更改它并确保 Antiforgery 在名称为 X-XSRF-TOKEN 的标头中搜索请求令牌。让我们手动添加 Antiforgery 并在 ConfigureServices 方法中设置选项：

services.AddAntiforgery(opts => opts.HeaderName = "X-XSRF-Token");

现在我们需要确保生成令牌并将请求令牌包含在名为 XSRF-TOKEN 的 cookie 中，以便 Angular $http 服务可以读取它并将其包含为标头。

这不能是仅 http 的 cookie，因为 Angular 代码需要读取 cookie 值，以便将其作为标头包含在后续请求中！