AngularJSで$ httpでASP.NET MVC CSRFトークンを送信

Question

私はASP.NET MVC Webアプリケーションを開発しています。私はAngularJSを使用しています。しかし、私は、CSRFの検証のために投稿フォームをサーバーに提出する際に問題を抱えています。まず第一に、私はAngularJSの初心者です。 AngularJSで

、私はボタンのクリックイベントに、次のようにサーバ側で

angular.module('loginApp', ['ui.bootstrap', 'blockUI']).controller('loginController', function ($scope) { 

    $scope.loginFormData = { } 

    $scope.submitLoginForm = function() 
    { 
     $http.post("url", $scope.loginFormData, function (response) { 

     }) 
    } 
}); 

をフォームを送信しています、私はここでポスト

 [HttpPost] 
     [AllowAnonymous] 
     [ValidateAntiForgeryToken] 
     public async Task<JsonResult> Login(LoginViewModel model) 
     { 
      //Do other stuff 
     } 

を形成するためにCSRFの検証を行い、私のフォームのHTMLです：

  @Html.AntiForgeryToken() 
      <div class="lock-container"> 
       <div class="panel panel-default text-center paper-shadow" data-z="0.5"> 
        <div class="panel-body"> 
         <div class="form-group"> 
          <div class="form-control-material"> 
           <input class="form-control" ng-model="username" type="text" placeholder="Username"> 
           @Html.LabelFor(x => x.UserName) 
          </div> 
         </div> 
         <div class="form-group"> 
          <div class="form-control-material"> 
           <input class="form-control" ng-model="password" type="password" placeholder="Enter Password"> 
           @Html.LabelFor(x=>x.Password) 
          </div> 
         </div> 

         <button ng-click="submitLoginForm()" class="btn btn-primary">Login <i class="fa fa-fw fa-unlock-alt"></i></button> 
        </div> 
       </div> 
      </div> 

実際にはフォームではありません。基本的にAjaxでデータを送信しています。あなたは@ Html.AntiForgeryToken（）の上部に気づいた。ブラウザで調べると、このように見ることができます。

私は何をしたい、私はそのトークン値を取得し、以下のような$ののHTTP POSTで送信したいです。

$http.post("url",{ "_RequestVerificationToken": $scope.csrfToken }, function (response) { 

     }) 

上記のように送信すると、サーバーでcsrf検証が成功します。どのように私はそれを達成することができますAngularJS？

Answer 1

これらの値は本文の代わりにヘッダーに渡すことができます。これは、そのモジュールに対してグローバルに行うことができます。以下のリンクを参照してください。

angular.module('app') 
.run(function ($http) { 
$http.defaults.headers.common['X-XSRF-Token'] = 
    angular.element('input[name="__RequestVerificationToken"]').attr('value'); 

}）;

このリンク

AngularJS Web Api AntiForgeryToken CSRF

https://www.asp.net/web-api/overview/security/preventing-cross-site-request-forgery-csrf-attacks