无法在角度的休息响应中访问 c​​ookie

Question

我有一个带 webapi 后端的角前端。我已经使用 OWIN/Identity 和 JWT 令牌实现了 OAuth v2 安全性（感谢 Taiseer Joudeh 的博客）。我的负担是我们仍然有需要特定 cookie 的遗留页面。当从登录请求返回 JWT 令牌时，我增加了来自 WebApi 的 Http 响应以包含该 cookie。我已验证 cookie 在响应标头中。

我的问题是我无法在我的角度响应处理程序中看到 cookie，我会将其推送到浏览器。根据我在 StackOverflow 其他地方找到的建议，我已经尝试了以下每一项，但到目前为止，我无法在 .js 代码中看到 cookie（替代尝试已被注释掉，但为了完整性而保留）。我还确保通过将“Access-Control-Allow-Headers”添加到“set-cookie”并将“Access-Control-Allow-Credentials”添加到“true”，在服务器上设置了适当的“允许”字段。我的 ValidateClientAuthenticationContext(..) 方法。

我需要做什么才能在我的 webapi 响应中看到附加的 cookie？这是服务器还是客户端的问题？两者都有？

在我的 authService.js 文件中：

var _login = function (loginData) {

    // this makes the data "form data"
    var data = "grant_type=password&client_id=ngAuthApp&username=" + loginData.userName + "&password=" + loginData.password;

    var deferred = $q.defer();

    $http.post(serviceBase + 'oauth/token', data, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
        .success(function (response) {

            localStorageService.set('authorizationData', { token: response.access_token, userName: loginData.userName });

            _authentication.isAuth = true;
            _authentication.userName = loginData.userName;

                console.log($cookies);

            //var xxx = $http.defaults.headers;
            //var headers = $http.response.headers;

            var ddc = $http.response.cookies;
            $cookies.DDC = ddc;

            deferred.resolve(response);

        })
        //.success(function (data, status, headers, config) {
        //    // any required additional processing here 
        //    var results = [];
        //    results.data = data;
        //    results.headers = headers();
        //    results.status = status;
        //    results.config = config;

        //    deferred.resolve(results);
        //})
        .error(function (err, status) {
            _logOut();
            deferred.reject(err);
        });

    return deferred.promise;

};

在我的自定义 OAuthProvider .cs 文件中

公共覆盖任务ValidateClientAuthentication(OAuthValidateClientAuthenticationContext context) { // 这里跳过很多代码

        context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { allowedOrigin });
        context.OwinContext.Response.Headers.Add("Access-Control-Allow-Credentials", new[] { "true" });
        context.OwinContext.Response.Headers.Add("Access-Control-Allow-Headers", new[] { "authorization", "content-type", "set-cookie" });

        context.Validated();
        return Task.FromResult<object>(null);
    }

Answer 1

您的 $http 调用还应将 withCredentials 标志设置为 true 以明确允许 cookie 共享。

$http.post(url, {withCredentials: true, ...})

withCredentials 标志允许 javascript 访问经过身份验证的用户会话。

//编辑 现在我再次阅读了您的问题，这可能不是您的问题。 withCredentials 用于在您发出需要经过身份验证的会话的下一个请求时将您的会话传达给服务器。从您的问题来看，您似乎想在 js 代码中验证您验证的 cookie 是否也可以通过代码访问。

Answer 2

根据文档 - 请参阅 here

$http.post() 方法返回一个HttpPromise 未来对象。您对 .post() 的调用会返回一个承诺。根据上述参考页面上的弃用通知：

$http 遗留的 promise 方法成功和错误已经 已弃用。请改用标准 then 方法。如果 $httpProvider.useLegacyPromiseExtensions 设置为 false 然后这些 方法会抛出 $http/legacy 错误。

所以不要使用 .success() / error()，而是使用这个：（从 docs 复制）

$http.post()
.then(function successCallback(response) {
  // this callback will be called asynchronously
  // when the response is available
}, function errorCallback(response) {
  // called asynchronously if an error occurs
  // or server returns response with an error status.
});

另外，如果您还没有尝试过这个（根据 .post() 调用，它似乎没有）设置您的$http 配置object 的responseType 属性。这将设置返回的response 对象的datatype。否则将返回 DOM string 的 default。它可能无法解决它，但它可能是一个开始。

这也可能需要withCredentials 属性集的帮助。测试它们，看看效果如何。想法来自bastijn的建议。

Answer 3

事实证明，错误在于我的假设。我希望浏览器会忽略直接从嵌入式 js 代码通过 Web 服务发送的 cookie。但是，响应标头在标头中具有“Set-Cookie”值，并且浏览器已经将其推送到其余 cookie 中。我真的没想到。

我必须补充一下，这对我来说是一个非常有用的问题，因为它教会了我很多关于 Web 编程以及浏览器如何使用 http 标头值的知识。感谢大家的时间！

马库斯