Question

我使用Spring MVC来构建我的restful服务： http://localhost:8088/SpringRestCSRF/rest/rest/greeting
我正在使用OWASP CSRFGuard 3.0来保护CSRF中的这些Restful服务。
使用简单的HTML-AJAX请求访问相同的Rest服务时，CSRF令牌已设置好，我收到了响应：

以下代码工作正常。

<!DOCTYPE html>
<html>
<head>
<title>REST Service with CSRF Protection</title>
<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<!-- First Get call OWASP CSRFGuard JS servlet which sets the token --> 
  <script src="http://localhost:8088/SpringRestCSRF/CsrfJavaScriptServlet"></script> 


<script type="text/javascript">
    $(document).ready(function() {
        $.ajax({
            url : "http://localhost:8088/SpringRestCSRF/rest/rest/greeting",
            type: 'POST',

        }).then(function(data, status, jqxhr) {
            $('.greeting-id').append(data);
            console.log(data);
        });
    });
</script>
</head>

<body>
    <div>
        <p class="greeting-id">The Response is  is : </p>
    </div>

</body>
</html>

当我使用Angular尝试同样的事情时，令牌没有设置，我收到CSRF保护错误。

Angular Code （我是Angular的新手）

<!DOCTYPE html>
<html lang="en">


<head>
<script
    src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

<!-- Assumption - First Get call to OWASP CSRFGuard JS servlet which sets the token --> 

<script src="http://localhost:8088/SpringRestCSRF/CsrfJavaScriptServlet"></script>
</head>

<body ng-app="myapp">

    <div ng-controller="MyController">
        <button ng-click="testPost(item, $event)">Send AJAX Request</button>
        <br /> Data from server: {{myData.fromServer}}

        <br /> Cookie Value {{$cookies}}
    </div>

    <script>
        /*----------------*/

        var app = angular.module('myapp', []);

        app
                .controller(
                        'MyController',
                        function($scope, $http) {
                            $scope.result = "";

                            $scope.init = function() {
                                $http.defaults.xsrfHeaderName = 'X-CSRF-TOKEN';
                                $http.defaults.xsrfCookieName = 'CSRF-TOKEN';
                            };

                            $scope.testPost = function() {
                                $http
                                        .post(
                                                'http://localhost:8088/SpringRestCSRF/rest/rest/greeting')
                                        .success(function(result) {
                                            $scope.result = result;
                                            $scope.myData.fromServer = data;
                                        });
                            };
                        });

    </script>

</body>

</html>

有人可以建议我应该如何在Angular中设置令牌。

来自Angular的引用：

在搜索此问题的解决方案时，请阅读以下声明。

跨站点请求伪造（XSRF）保护XSRF是一种技术   未经授权的网站可以获取用户的私人数据。角   提供了一种对抗XSRF的机制。执行XHR请求时   $ http服务从cookie中读取令牌（默认情况下为XSRF-TOKEN）   并将其设置为HTTP标头（X-XSRF-TOKEN）。既然只有JavaScript   在您的域上运行可以读取cookie，您的服务器可以   确保XHR来自您域上运行的JavaScript。该   不会为跨域请求设置标头。

要利用这一点，您的服务器需要在一个令牌中设置一个令牌   在第一个HTTP上称为XSRF-TOKEN的JavaScript可读会话cookie   GET请求。在随后的XHR请求中，服务器可以验证   cookie匹配X-XSRF-TOKEN HTTP标头，因此请确保   只有您域上运行的JavaScript才能发送请求。   对于每个用户，令牌必须是唯一的，并且必须由   服务器（防止JavaScript编写自己的令牌）。我们   建议令牌是您网站身份验证的摘要   带有盐的饼干，以增加安全性。

可以使用xsrfHeaderName和指定标题的名称   $ httpProvider.defaults的xsrfCookieName属性   config-time，运行时$ http.defaults或每请求配置   对象

Answer 1

现在有了angular2，事情发生了变化..但是如果你仍然使用旧版本，你可以使用它：

var app = angular.module('myapp', []);

app.config(function($httpProvider) {
  $httpProvider.defaults.xsrfCookieName = 'XSRF-TOKEN';
  $httpProvider.defaults.xsrfHeaderName = 'X-XSRF-TOKEN';
});

app.controller ...etc

如何在角度页面中设置CSRF令牌 - OWASP CSRFGuard 3.0

1 个答案: