Blazor 客户端应用程序配置请求以在 CORS 上发送 cookie 失败答案

【问题标题】：Blazor Client App configuring request to send cookies on CORS failingBlazor 客户端应用程序配置请求以在 CORS 上发送 cookie 失败
【发布时间】：2022-07-08 20:58:32
【问题描述】：

我有一个 Blazor WASM 客户端应用程序正在尝试将 cookie 发送到我的 asp.net api，都在本地主机上但在不同的端口上，因此需要 CORS。

我已经在 API 端配置并应用了 CORS 策略，但在客户端请求端找出正确的选项或标头设置时遇到问题。在 Chrome 开发工具中，我在标头中看到了 cookie，但它似乎没有到达 API，因为那一侧的 cookie 计数返回零。

我已经在浏览器中直接使用 GET 测试了 API 控制器，并且 cookie 可以正常工作，所以它一定是 CORS 和 cookie 一起出现的问题。

这是来自 Blazor WASM 客户端操作的代码 sn-p：（我已注释掉其他失败的配置尝试）

private async void CheckCookie()
{
    HttpClient client = new HttpClient();
    HttpRequestMessage requestMessage = new HttpRequestMessage(HttpMethod.Get, "https://localhost:7139/ValidateCookie");
    //requestMessage.Options.Set(new HttpRequestOptionsKey<string>(),"true");
    //requestMessage.Options.Append(new KeyValuePair<string, object>("credentials","include"));
    requestMessage.Options.Set(new HttpRequestOptionsKey<string>("Access-Control-Request-Headers"),"Cookie");
    requestMessage.Options.Set(new HttpRequestOptionsKey<string>("Access-Control-Allow-Origin"),"http://localhost:5196");
    requestMessage.Options.Set(new HttpRequestOptionsKey<string>("Access-Control-Allow-Methods"),"GET");
    //requestMessage.Headers.Add("Access-Control-Allow-Credentials","true");
    //requestMessage.Headers.Add("withCredentials","true");
    CommunityObject[] subbedCommunities;
    List<CommunityObject> listSubbedCommunities = new List<CommunityObject>();
    HttpResponseMessage returnMessage = await client.SendAsync(requestMessage);
    var stream = returnMessage.Content.ReadAsStreamAsync();
    var contentstring = returnMessage.Content.ReadAsStringAsync();
    Console.WriteLine("Community CheckCookie return stream result: " + stream.Result);
    cookieresult = contentstring.Result;

}

这是我当前的 program.cs CORS 配置：（我也尝试将源设置为 localhost:port-the-client-is-using）

builder.Services.AddCors(options =>
    {
    options.AddPolicy("CookiePolicy",
    policy =>
    {
        policy.AllowCredentials().AllowAnyHeader().AllowAnyMethod().SetIsOriginAllowed(origin => new Uri(origin).Host == "localhost");
    });

这里是被调用的控制器：

public class ValidateCookieToken : ControllerBase
{

    [EnableCors("CookiePolicy")]
    [HttpGet("/ValidateCookie")]
    public String Get()
    {
        String bearertoken;
        Console.WriteLine("ValidateCookies Headers Keys: " + Request.Headers.Keys);
        foreach (var VARIABLE in Request.Headers.Keys)
        {
            Console.WriteLine("ValCookie Key: " + VARIABLE + " - Value: " + Request.Headers[VARIABLE]);
        }
        Console.WriteLine("ValidateCookies current cookie count: " + Request.Cookies.Count);
        Console.WriteLine("Validatecookies cookie keys: " + Request.Cookies.Keys);
        Console.WriteLine("ValCook headers cookie: " + Request.Headers.Cookie.ToString());
        Request.Cookies.TryGetValue("bearer", out bearertoken);
        String decodedbearer = Encoding.ASCII.GetString(Convert.FromBase64String(bearertoken));
        return decodedbearer;
    }
}

除此之外，有没有一种方法可以记录 CORS 事务，以便我至少可以从那里调试它。就目前而言，我不知道 CORS cookie 在哪一侧、客户端或 API 被阻止。

编辑：下面是添加 cookie 的登录控制器。

[HttpGet("/Login")]
    public String Get(String Email, String Pass)
    {
        String token = null;
        token = Auth.Login(Email, Pass);
        if (token != null)
        {
            String basicauth = Convert.ToBase64String(Encoding.ASCII.GetBytes(Email+":"+token));
            CookieOptions cookieOptions = new CookieOptions();
            Console.WriteLine("Cookie path is: " + cookieOptions.Path);
            Console.WriteLine("Cookie domain is: " + cookieOptions.Domain);
            Console.WriteLine("Cookie isEssential: " + cookieOptions.IsEssential);
            Console.WriteLine("Cookie Samesite: " + cookieOptions.SameSite);
            Console.WriteLine("Cookie secure: " + cookieOptions.Secure);
            Console.WriteLine("Cookie expires: " + cookieOptions.Expires);
            Console.WriteLine("Cookie httponly: " + cookieOptions.HttpOnly);
            Console.WriteLine("Cookie max age: " + cookieOptions.MaxAge);
            cookieOptions.IsEssential = true;
            cookieOptions.SameSite = SameSiteMode.Lax;
            cookieOptions.Secure = false;
            Response.Cookies.Append("bearer",basicauth,cookieOptions);
            Console.WriteLine("Cookie count after login: " + Request.Cookies.Count);
            return basicauth;
        }
        return "token was null";
    }

【问题讨论】：

“因为那一侧的 cookie 计数返回零” - 好的，但是请求确实到达了控制器上的端点？因为那是 CORS 工作的时候。 cookie 是一个单独的问题 afaik。
你在什么时候真正设置一个cookie？
是的，请求到达是因为我可以从这些请求中读取其他标头，但问题是 cookie 没有随请求一起发送，或者在 API 端被阻止，因为cookie 未显示在 API 端的标头中，并且 request.cookies 为空。我假设它要么客户端没有发送它（默认情况下它不用于 CORS），要么我在 API 端错误配置了 CORS 以允许凭据。我将编辑帖子以显示添加 cookie 的另一个控制器。
另外，在 chrome 的开发工具中，我可以在标头中看到 cookie，所以我认为它至少在发送，但我不知道如何验证浏览器是否真的在发送它。
试试 fiddler http 检查器

标签： asp.net cookies cross-domain blazor-webassembly

【解决方案1】：

您在客户端收到任何消息吗？这可能是您的 API 不允许 cookie 标头或需要配置 Access-Control-Allow-Credentials 的预检事项

Set cookies for cross origin requests

https://livebook.manning.com/book/cors-in-action/chapter-5/4

【讨论】：