个人中心
gpt4 book ai didi

javascript - 如何在 Angular 页面中设置 CSRF token - OWASP CSRFGuard 3.0

转载 作者：行者123 更新时间：2023-12-03 16:45:38 26 4
gpt4 key购买 nike

  1. 我使用 Spring MVC 构建了我的 restful 服务: http://localhost:8088/SpringRestCSRF/rest/rest/greeting

  2. 我正在使用 OWASP CSRFGuard 3.0 来保护这些 Restful 服务免受 CSRF。

  3. 当使用简单的 HTML 访问相同的 Rest 服务时 - AJAX 请求 - CSRF token 正在设置并且我正在收到响应:

下面的代码运行良好。

<!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>
  1. 当我使用 Angular 尝试同样的事情时， token 没有设置，我收到 CSRF 保护错误。

Angular 代码(我是 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 中设置 token 。

来自 Angular 的引述:

While searching a solution to this problem, read the below statement.

Cross Site Request Forgery (XSRF) Protection XSRF is a technique by which an unauthorized site can gain your user's private data. Angular provides a mechanism to counter XSRF. When performing XHR requests, the $http service reads a token from a cookie (by default, XSRF-TOKEN) and sets it as an HTTP header (X-XSRF-TOKEN). Since only JavaScript that runs on your domain could read the cookie, your server can be assured that the XHR came from JavaScript running on your domain. The header will not be set for cross-domain requests.

To take advantage of this, your server needs to set a token in a JavaScript readable session cookie called XSRF-TOKEN on the first HTTP GET request. On subsequent XHR requests the server can verify that the cookie matches X-XSRF-TOKEN HTTP header, and therefore be sure that only JavaScript running on your domain could have sent the request. The token must be unique for each user and must be verifiable by the server (to prevent the JavaScript from making up its own tokens). We recommend that the token is a digest of your site's authentication cookie with a salt for added security.

The name of the headers can be specified using the xsrfHeaderName and xsrfCookieName properties of either $httpProvider.defaults at config-time, $http.defaults at run-time, or the per-request config object.

最佳答案

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

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

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

app.controller ...etc

关于javascript - 如何在 Angular 页面中设置 CSRF token - OWASP CSRFGuard 3.0，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30140189/

26 4 0
文章推荐： ios - ios Google Analytics(分析)广告系列跟踪
文章推荐： batch-file - 如何转义 `@` 中的 `forfiles` 变量替换？
文章推荐： google-analytics - 如何将hAxis(x轴)格式更改为HH:mm？
文章推荐： javascript - 离开网站时弹出
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com