AngularJS跨域无法读取Set-Cookie及维持会话问题求助

兄弟，我帮你捋清楚这个跨域Cookie的问题了，核心就是跨域带凭证的CORS规则没配置到位，咱们一步步来解决：

你遇到的错误已经说得很明白：当请求开启withCredentials: true时，后端的Access-Control-Allow-Origin不能是通配符*，必须明确指定你的前端域名（比如http://localhost:52000），同时还要返回Access-Control-Allow-Credentials: true响应头。浏览器出于安全考虑，只要这两个条件不满足，就会拦截Cookie，也不让后续需要权限的请求通过。

这部分是关键，必须先改后端的CORS设置：

• 如果是ASP.NET（OWIN）：
  把原来的通配符CORS配置替换成指定源的版本：

  // 不要用AllowAll，换成下面的
  app.UseCors(new CorsPolicy
  {
      AllowAnyHeader = true,
      AllowAnyMethod = true,
      Origins = { "http://localhost:52000" }, // 你的前端地址，生产环境换成实际域名
      SupportsCredentials = true // 必须开启这个，允许携带凭证
  });
  

• 如果是ASP.NET Core：
  在服务注册和中间件里配置带凭证的CORS策略：

  // 注册CORS策略
  builder.Services.AddCors(options =>
  {
      options.AddPolicy("AllowFrontendOrigin",
          policy =>
          {
              policy.WithOrigins("http://localhost:52000")
                    .AllowAnyHeader()
                    .AllowAnyMethod()
                    .AllowCredentials(); // 核心配置
          });
  });
  
  // 启用CORS中间件（要放在UseRouting之后，UseAuthorization之前）
  app.UseCors("AllowFrontendOrigin");
  

• 另外，后端设置Cookie时要注意：
  跨域场景下，Cookie的SameSite属性要设为None，同时生产环境必须加Secure属性（本地HTTP开发可以暂时设为false），不然浏览器不会保存Cookie。示例代码：

  Response.Cookies.Append("SESSIONID", "你的会话值", new CookieOptions
  {
      HttpOnly = true, // 建议开启，防止XSS攻击
      SameSite = SameSiteMode.None,
      Secure = false, // 本地HTTP用false，生产HTTPS改true
      Domain = ".your-backend-domain.com" // 跨子域名时需要，单域名可以省略
  });
  

你的前端代码有两个小问题：

1. $cookies.get('Set-Cookie')是错误的：Set-Cookie是响应头的名称，不是Cookie的实际名称，你应该获取后端设置的具体Cookie名（比如上面的SESSIONID）。
2. 变量名笔误：你定义的是$scope.userCreds = {};，但请求时用了$scope.user，这会导致请求参数为空。

修正后的控制器代码：

appAuth.controller('ctlLogin', function ($scope, $http, $cookies, $rootScope) {
    $scope.userCreds = {};
    var config = { 
        withCredentials: true 
    };

    $scope.login = function () {
        $http.post(urlLogin, $scope.userCreds, config).then(function onSuccess(response) {
            console.log('登录成功');
            // 替换成后端实际设置的Cookie名称
            var sessionCookie = $cookies.get('SESSIONID');
            console.log('会话Cookie值:', sessionCookie);
        }, function onFailure(response) {
            console.log('登录失败:', response.data);
        });
    };
});

• 浏览器隐私设置：如果本地开发还是有问题，检查浏览器是否允许第三方Cookie（比如Chrome的隐私设置里，默认可能阻止第三方Cookie，需要临时开启）。
• OPTIONS预请求：后端要正确处理OPTIONS请求，返回对应的CORS头——带withCredentials的请求会触发预请求，后端必须响应OPTIONS并返回正确的头才能让后续请求通过。

内容的提问来源于stack exchange，提问作者gordon