Angularjsいいえ「アクセス制御 - 許可 - 起源」ヘッダが要求されたリソース

Question

イムとしてエラーを得ることにある。

がhttp://localhost:10948/Api/Home/PostData/[object%20Object]の読み込みに失敗しました：いいえ「アクセス制御 - 許可 - 起源」ヘッダが存在しています要求されたリソース上でOrigin 'http://localhost:57580'はアクセスできません。応答は

protected void Application_BeginRequest() 
     { 
      string[] allowedOrigin = new string[] { "http://localhost:57580", "http://localhost:11518" }; 
      var origin = HttpContext.Current.Request.Headers["Origin"]; 
      if (origin != null && allowedOrigin.Contains(origin)) 
      { 
       HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", origin); 
       HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET,POST"); 
      } 

Angular.js

$scope.SubmitForm = function (isValied) { 
     var EmployeeDetails = { 
      'Empname': $scope.Emp.EmpName 
     } 
     if (isValied) { 
     EmployeeFactoryService.SaveEmployeee(EmployeeDetails).then(function() 

      }) 
     }  
    } 

ファイルであっても、私は私のWEBAPI（Global.asax.cs）でアクセス-controllオリオンファイルを持っているHTTPステータスコード404

を持っていました

工場.js

EmployeeFactoryServices.SaveEmployeee = function (Employee) { 
    return $http({ 
     url: 'http://localhost:10948/Api/Home/PostData/'+ Employee, 
     method: 'POST', 
     ContentType: 'application/x-www-form-urlencoded', }) 

Answer 1

変更し、次のようにあなたがCORSを設定する方法を経由して、これを克服することができ、4-、

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*"); 
     if (HttpContext.Current.Request.HttpMethod == "OPTIONS") 
     { 
      //These headers are handling the "pre-flight" OPTIONS call sent by the browser 
      HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, OPTIONS"); 
      HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept"); 
      HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000"); 
      HttpContext.Current.Response.End(); 
     } 

も要求は、

return $http({ 
     url: 'http://localhost:10948/Api/Home/PostData/'+ , 
     method: 'POST', 
     data : Employee, 
     ContentType: 'application/json' }) 

Answer 2

クロムエクステンションコードがあります。 それを使用して、あなたは行こうとしています。私はあなたが送信しようとしているオブジェクトを文字列化していない、あなたのURLから見ることができるように

Answer 3

1-ので、私はあなたがより良いあなたのポストの要求のためのContent-Type:application/jsonを使用したいJSON.stringify(EmployeeDetails)

2-使用して、それを文字列化することをお勧めします。

3 - あなたはあなたのバックエンドのコードにあなたのクライアント側アプリケーションからの要求を許可する必要が

あなたは一時的にthis extension