Как создать фабрику, значение которой установлено во время выполнения, и ее можно получить во время выполнения в AngularJS

Мне нужно установить значение моей службы, которая обеспечивает токен csrf во время выполнения. Как мне это сделать? Вот моя попытка, но я вижу, что заголовок X-XSRF-TOKEN является объектом в заголовке при входе в систему. Я думаю, что значение csrf_service не будет получено на фабрике аутентификации.Как создать фабрику, значение которой установлено во время выполнения, и ее можно получить во время выполнения в AngularJS

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) {} 
     } 
    }; 

});

источник

2014-09-22 Junior Superman

не вводят в виде строки в 'run' ... не так бросая ошибку? – charlietfl

К сожалению, это была опечатка на почте, а не в моем коде. –

Я создал следующий плункер, который работает http://plnkr.co/edit/8hPZ72GXcoh7TWEu1BZ9?p=preview –

Изменить ваш setToken ответ значение response.data

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

EDIT:

$ http calls async их обратные вызовы могут запускать любой заказ. Возможно, вам придется разрешить данные асинхронизации до загрузки страницы.

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

источник

2014-09-22 13:02:42 Luffy

Эй, в моей функции setToken, я сделал console.log (this.csrf_token) после того, как значение было установлено, и это было все отлично (маркер был зарегистрирован). Но после этого, когда был вызван getToken, он был пуст. Полагаю, это потому, что когда csrfService передается на фабрику, this.csrf_token инициализируется нулем. Но как этого избежать? –

Заводы, услуги все одноточечные. Они сохраняют свое состояние до обновления или страницы F5. Означает, что вы где-то перезагружаете страницу. Если вам нужно сохранить эти данные, вы можете использовать cookie или localstorage. – Luffy

Другая возможность, чтобы ваш call-блок api/auth/csrf_token запускался после того, как вы вызвали логин. Если это проблема, вам нужно разрешить токен перед загрузкой страницы. http://odetocode.com/blogs/scott/archive/2014/05/20/using-resolve-in-angularjs-routes.aspx – Luffy

Я создал 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

источник

2014-09-22 15:15:34

Как создать фабрику, значение которой установлено во время выполнения, и ее можно получить во время выполнения в AngularJS

ответ

Смежные вопросы