13

次のコードのように、リソースを提供するサービスが必要です。

   angular.module('myApp.userService', ['ngResource'])
  .factory('UserService', function ($resource)
  {
    var user = $resource('/api/user', {},
          {
            connect: { method: 'POST', params: {}, isArray:false }
          });
    return user;
  }

次に、connectアクションを使用するときに、HTTP ヘッダーを動的に渡したいと思います。つまり、呼び出しごとに変更される可能性があります。コントローラーの例を次に示します。コード内のコメントを参照してください。

 $scope.user = UserService;

 $scope.connect = function ( user )
        {
          var hash = 'Basic ' + Base64Service.encode(user.login + ':' + user.password);

          // I would like this header to be computed 
          // and used by the user resource
          //  each time I call this function
          $scope.user.headers = [{Authorization: hash}];

          $scope.user.connect( {},
              function()
              {
                  // successful login
                  $location.path('/connected');
              }
              ,function()
              {
                  console.log('There was an error, please try again');
              });
       }

直接またはトリックを介してそれを行う方法を知っていますか?

最終的な考え

ファクトリは実際にはファクトリ (!) を返すため、ヘッダーは完全に動的ではないため、受け入れられた回答は質問に完全には答えませんが、これは私のコードには当てはまりません。

$resource はファクトリであるため、動的にする方法はありません。

最後に、ユーザーが接続するたびにリソース オブジェクトを破棄します。このようにして、ユーザーが接続したときにヘッダーが計算されたリソースを取得します。

@Stewie が提供するソリューションはそのために役立つので、受け入れられたままにします。

これは、(再)接続時にリソースが破棄/再作成されるため、複数回使用できる接続方法です。

 this.connect = function (user)
 {
    self.hash = 'Basic ' + Base64Service.encode(user.login + ':' + user.password);
console.log("CONNECT login:" + user.login + " - pwd:" + user.password + " - hash:" + self.hash);

if (self.userResource)
{
  delete self.userResource;
}

self.userResource = $resource('/api/user/login', {}, {
  connect: {
    method: 'POST',
    params: {},
    isArray: false,
    headers: { Authorization: self.hash }
  }
});

var deferred = $q.defer();
self.userResource.connect(user,
  function (data)
  {
    //console.log('--------- user logged in ----- ' + JSON.stringify(data));
    // successful login
    if (!!self.user)
    {
      angular.copy(data, self.user);
    }
    else
    {
      self.user = data;
    }

    self.setConnected();

    storage.set('user', self);

    deferred.resolve(self);
  },
  function (error)
  {
    self.user = {};
    self.isLogged = false;

    storage.set('user', self);

    deferred.reject(error);
  }
);

return deferred.promise;

};

4

2 に答える 2

18

angularjs v1.1.1 および ngResource v.1.1.1 以降では、アクション オブジェクトのheadersプロパティを使用してこれを実現できます。$resource

$resourceカスタム ヘッダーをパラメーターとして受け取り、適切なアクション定義でカスタム ヘッダーが設定されたオブジェクトを返す関数でリソースをラップすることができます。

PLUNKER

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

app.controller('AppController',
  [
    '$scope',
    'UserService',
    function($scope, UserService) {
      $scope.user = {login: 'doe@example.com', password: '123'};

      $scope.connect = function() {
        // dropping out base64 encoding here, for simplicity
        var hash = 'Basic ' + $scope.user.login + ':' + $scope.user.password;
        $scope.user.headers = [{Authorization: hash}];

        UserService({Authorization: hash}).connect(
          function () {
            $location.url('/connected');
          },
          function () {
            console.log('There was an error, please try again');
          }
        );

      };

    }
  ]
);

app.factory('UserService', function ($resource) {
  return function(customHeaders){
    return $resource('/api/user', {}, {
      connect: { 
        method: 'POST',
        params: {},
        isArray: false,
        headers: customHeaders || {}
      }
    });
  };

});
于 2013-12-13T16:58:07.197 に答える