Question

我必须设置我的服务的值，它在运行时提供csrf令牌。我该怎么做？这是我的尝试，但我发现当登录发生时，标题X-XSRF-TOKEN是标题中的对象。我认为在身份验证工厂中没有检索到csrf_service的值。

app.factory('csrfService', function(){
    this.csrf_token = null;
    return {
        setToken: function(value){
            this.csrf_token = value;
        },
        getToken: function(){
            return this.csrf_token;
        }
    };
});

我注入它

app.run(function(csrfService){
    $http.get("api/auth/csrf_token").then(function(response) {          
        csrfService.setToken(response);         
    });
});

我找回它

app.factory('Authentication', function(csrfService){
    return {
        login: function(){
            $http.post("api/auth/login", {
                userName: userName,
                password: password
            }, {headers:{'X-XSRF-TOKEN': csrfService.getToken()}})
            .then(function(result) {}
        }
    };

});

Answer 1

将setToken值响应更改为response.data

app.run(function(csrfService){
    $http.get("api/auth/csrf_token").then(function(response) {          
        csrfService.setToken(response.data);         
    });
});

编辑：

$ http调用是异步的，他们的回调可以运行任何订单。您可能需要在页面加载之前解析异步数据。

http://odetocode.com/blogs/scott/archive/2014/05/20/using-resolve-in-angularjs-routes.aspx http://blog.brunoscopelliti.com/show-route-only-after-all-promises-are-resolved

Answer 2

我创建了一个plunker here。代码按我的意愿工作。代码的相关部分就在这里。

的script.js

angular.module('httpExample', [])
  .controller('FetchController', function($scope, Authentication){
    $scope.click = function(){
      Authentication.login();
    };
  })

  .factory('csrfService', function(){
    this.csrf_token = null;
    return {
        setToken: function(value){
            this.csrf_token = value;
            console.log('token is set as: '+this.csrf_token);
        },
        getToken: function(){
          console.log('token is retrieved as: '+this.csrf_token);
          return this.csrf_token;
        }
    };
  })

  .run(function(csrfService, $http){
    $http.get("hello.html").then(function(response) {
      console.log(response.data);
      csrfService.setToken(response.data);
    });
  })

  .factory('Authentication', function(csrfService, $http){
    return {
        login: function(){
            $http.post("api/auth/login", {
                userName: "userName",
                password: "password"
            }, {headers:{'X-XSRF-TOKEN': csrfService.getToken()}})
            .success(function(data, status, headers, config) {
              // this callback will be called asynchronously
              // when the response is available
            })
        }
    };
  })

;

的index.html

<body ng-app="httpExample">
  <div ng-controller="FetchController">
    <div ng-click="click()">Click me</div>
  </div>
</body>

hello.html的

Hello,Superman

如何创建一个工厂，其值在运行时设置，并且可以在运行时在AngularJS中检索

2 个答案: