6

Razor MVC ヘルパーによってログイン フォームで生成される RequestVerificationToken を、アプリケーションの認証を管理するために行った AngularJS サービスに渡したいと思います。

私のフォームは次のとおりです。

<div ng-model="loginRequest" >
        <form ng-submit="submit()"  ng-controller="loginCtrl">
            @Html.AntiForgeryToken()

            <input id="username" ng-model="loginRequest.Username"  type="text" name="text"  />
            <input id="password" ng-model="loginRequest.Password" type="text" name="text" />
            <input type="submit" id="submit" value="Submit" />
            <br/>
            isValid: {{loginRequest.isValid}}
            <br/>
            username: {{loginRequest.Username}}
            <br/>
            Password: {{loginRequest.Password}}
        </form>
    </div>

@Html.AntiForgeryToken() は次のようにレンダリングされます。

<input name="__RequestVerificationToken" type="hidden" value="AVzyqDKHSPjaY7L_GTpkasMAABRQRVRFUkFMSUVOV0FSRVxQZWRybwA1">

私のAngujarJsコントローラーは私の「loginService」を正常に注入し、Post経由でユーザー名とパスワードをサービスに送信できます

function loginCtrl($scope, loginService) {
   $scope.submit = function () {
      loginService.authenticate($scope.loginRequest,function(data) {
          $scope.loginRequest.isValid = (data.User!=null);
          //console.log(data);
      });

   };
}

サービス：

angular.module('App.services', ['ngResource']).
    factory('loginService',
        function ($resource) {
            return $resource('/Api/User/login', '',
                {
                        authenticate: {
                        method: 'POST',
                        isArray: false,
                        headers: { 'X-XSRF-Token': '?????' }
                    }
                });
        });

私の質問は、フォームでレンダリングされたトークンを読み取ってサービスに渡し、ログインフォームから取得したトークンを使用してヘッダーを設定する方法です.そのタスクを実行するためにディレクティブを作成する必要があるかどうかわからないので、提案を歓迎します!

4

3 に答える 3

3

悲しいことに、最も簡単な方法は、 のjquery.js前にプロジェクトにインクルードしてから、次のangular.jsようにすることです。

headers: { 'X-XSRF-Token': angular.element('input[name="__RequestVerificationToken"]') }
于 2013-08-07T16:33:56.180 に答える