如何为跨域请求实现csrf保护

Question

我有两个Web应用程序,一个用于AngularJS中的Web UI,另一个用于Java中的REST Web服务.两者都部署在不同的域上.

应用程序使用cookie进行身份验证.每当用户输入有效的用户名和密码时,服务器返回包含令牌的仅http cookie,并且cookie将在所有请求中传递.我在两个应用程序上启用了CORS,这就是会话cookie正常工作的原因.

现在,我正在尝试为此添加CSRF保护.我试图使用csrf cookie,在服务器中将发送csrf cookie(而不是httponly)作为REST响应的一部分,UI将从cookie读取值并将其传递到csrf令牌头中以用于其他REST调用.

我面临的这种方法的问题是,由于服务器位于不同的域中,我无法使用AngularJs中的$ cookies读取cookie.有没有办法读取该cookie的值？如果没有,那么我可以用其他方式实现CSRF吗？

我还尝试在浏览器中在Web UI上实现csrf cookie的创建,但是浏览器不会将cookie作为其在不同域中的web服务发送.

那么,我的问题是如何为这种情况实施csrf保护？

Answer 1

你是在正确的轨道上:

我还尝试在浏览器中在Web UI上实现csrf cookie的创建,但是浏览器不会将cookie作为其在不同域中的web服务发送.

CSRF cookie并不意味着"发送"到服务器,它意味着由客户端读取,然后在自定义HTTP请求头中提供.<img src="">来自其他域的伪造GET请求(由HTML标记触发)无法设置自定义标头,因此您可以断言该请求来自您域中的javascript客户端.

这里是你如何实现你的工作的想法,想象你有api.domain.com和ui.domain.com:

1)用户从中加载Angular客户端 ui.domain.com

2)用户将Angular客户端的认证信息发布到 api.domain.com

2)Sever使用HttpOnly身份验证cookie(称为authCookie自定义标头)和自定义标头进行回复,例如X-Auth-Cookie,此标头的值是一个唯一值,该值链接到由authCookie

3)Angular客户端读取X-Auth-Cookie标头值并将该值存储XSRF-TOKEN在其域中的cookie中,ui.domain.com

4)用户发出受保护资源的请求api.domain.com.浏览器将自动提供authCookie值,Angular将自动发送X-XSRF-TOKEN标头,并将发送从XSRF-TOKENcookie中读取的值

5)您的服务器声明该值X-XSRF-TOKEN链接到由该值标识的同一会话authCookie

我希望这有帮助!我还写过关于针对单页应用程序(SPA)的 Angular,基于令牌的身份验证的令牌身份验证(免责声明:我在Stormpath工作)

Answer 2

Angularjs 内置了对 CSRF 的支持，但不幸的是它不能跨域工作，所以你必须构建自己的。

我设法让它工作，首先在第一个请求的标头和 cookie 中返回一个随机令牌。为了读取标题，您需要将其添加到Access-Control-Expose-Headers. 然后将其添加到所有帖子中

$http.get('url').
    success(function(data, status, headers) {
        $http.defaults.headers.post['X-XSRF-TOKEN'] = headers('XSRF-TOKEN');
    });

然后在服务器上，您可以将 cookie 值与标头中的值进行比较，以确保它们相同。