Web Api 2'de, Cors etkinleştirildikten sonra bile geçerli bir belirteci almayla ilgili sorun oluştu

Question

Böylece, VS2015 çözümümdeki NuGet paketini Microsoft.AspNet.WebApi.Cors.5.2.3 yükledim ve Web Api projemde CORS özelliğini etkinleştirdim.

/token POST isteğimi test etmek için Fidder'ı ve API denetleyicisine GET isteğimi \api\values başarıyla kullandım.

Fiddler'da geri aldığım jetonu kullanırsam ve bunu JavaScript GET isteğime kodlayarak - Tek Sayfam Uygulamamdan \api\values'a başarılı bir istekte bulunabilirim.

SORUN: Yerel dev ortamımda http://localhost:17883/token için başarılı bir POST isteği oluşturamıyorum.

Chrome'da hatadır:

XMLHttpRequest cannot load http://localhost:17883//token. 
Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response. 
XHR failed loading: POST "http://localhost:17883//token". 

Ben WebApiConfig.cs içinde CORS'yi etkinleştirdikten - Eğik authService, ben bir API kadar kodlanmış Benim içinde

using System; 
 
using System.Collections.Generic; 
 
using System.Linq; 
 
using System.Net.Http; 
 
using System.Web.Http; 
 
using Microsoft.Owin.Security.OAuth; 
 
using Newtonsoft.Json.Serialization; 
 

 
namespace API 
 
{ 
 
    public static class WebApiConfig 
 
    { 
 
     public static void Register(HttpConfiguration config) 
 
     { 
 
      // Web API configuration and services 
 
      // Configure Web API to use only bearer token authentication. 
 
      config.SuppressDefaultHostAuthentication(); 
 
      config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType)); 
 

 
      // Web API routes 
 
      config.MapHttpAttributeRoutes(); 
 

 
      // *** ENABLE CORS *** 
 
      var cors = new System.Web.Http.Cors.EnableCorsAttribute("*", "*", "*"); 
 
      config.EnableCors(cors); 
 
      
 
      config.Routes.MapHttpRoute(
 
       name: "DefaultApi", 
 
       routeTemplate: "api/{controller}/{id}", 
 
       defaults: new { id = RouteParameter.Optional } 
 
      ); 
 
     } 
 
    } 
 
}

Login sayfamda bir düğüme bağlanan test işlevi (bu istek başarılı):

var _apitest = function() 
 
    { 
 
     var deferred = $q.defer(); 
 

 
     var tkn='cbJZpiF-rEdi_WgWzuFOAxPZ0lBiqivEnOmpSYMPu_fuvu37cpLFzHhzc119GfwIc6dnDivYhhH2a1O2bMa6EExRGa3lvPfzZJHiDDaH6klIU2NFEG5FMxFl_-Z_jBQvPkPyW_31iP6P_oVNZZpXzkQfkwA4zilzKLE7If2Dko6MNNID1lscVfkZ4emJXWpalSXCS4A7qmO-ceIchMfrcbZHgVqBjZC_YHz-DxAfg2lTksUdn8NBir_cDOH5Ymsrzj_bKP1H6WJULDfZEPuh0PpB2DlJEXOV63KWUf7Eubp_FYfni5czD1Z-lh2a2RPRfpRxlMQVBUCCp03_Ul5a6lzOFHSJCJlynidw2DV_InK-oFZEuvQK2Xiy_7wq0JVmx-Nej1bQRN7b2eWK25jjdrTfCNyMdtmDZ7qOSmX3dWuyQhCbp_15ciFhmr7wfIYPzsFssbg-XHtDi2lw87KkJ0IhNmtnsoNyKCrM5ibJG5O5t_gxr3l52JN54Jj2mbeY'; 
 

 
     var req={ 
 
      "method": "GET",    
 
      "url": "http://localhost:17883/api/values", 
 
      "headers": {     
 
       "Authorization": "Bearer " + tkn 
 
      } 
 
     };   
 
     $http(req).then(function (data) 
 
     { 
 
      deferred.resolve(data); 
 
     }); 
 

 
     return deferred.promise; 
 
    };

\token Bu POST isteği başarılı DEĞİLDİR:

var _loginUserPost = function (loginData) 
 
    {   
 
     var controllerpath = "/token";  
 
     var url = serviceBase + controllerpath; 
 
     var body = "username=" + loginData.userName + "&password=" + loginData.password + "&grant_type=password"; 
 
     
 
     var deferred = $q.defer(); 
 
     deferred.notify("Logging in user..."); 
 

 
     // POST REQUEST !! 
 
     var req = { 
 
      method: 'POST', 
 
      encoding: 'JSON', 
 
      headers: { 
 
       'Content-Type': 'application;x-www-form-urlencoded'     
 
      }, 
 
      url: url, 
 
      data: body 
 
     }; 
 

 
     $http(req).then(function (data) 
 
     { 
 
      deferred.resolve(data); 
 
     }, function (err) 
 
     { 
 
      deferred.reject("Failed to login user via api call."); 
 
      console.log("Failed to login user via api call. Errors details: " + err); 
 
     }); 
 

 
     return deferred.promise; 
 
    }

Ben de EnableCors özniteliği ile ApplicationOAuthProvide sınıf süslemek için çalıştı, ama hala çalışmıyor:

[EnableCors(origins: "*", headers: "*", methods: "*")] 
public class ApplicationOAuthProvider : OAuthAuthorizationServerProvider 
{ 
    ... 
} 

Gerçekten neyi kaçırdığımı bilmem gerek. Farklı şeyler arıyor ve deniyorum - ama boşuna.

Tavsiye edilir.

Bob

********* GÜNCELLEME - Ben şimdiye kadar denedim ne ************

Yine \token isteği vurulmadan Chrome'daki CORS istisnasıyla geri döndü. Ben Headers eklemek için başarısız denedim

(arama "Adım 10:" Bu makalede: http://bitoftech.net/2014/06/01/token-based-authentication-asp-net-web-api-2-owin-asp-net-identity/):

public override async Task GrantResourceOwnerCredentials(OAuthGrantResourceOwnerCredentialsContext context) 
    { 

     context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" }); // BM: 

    ... 
    } 

Answer 1

Eğer denetleyici bir Seçenekler() Aksiyon olduğundan emin olun. Muhtemelen gönderiden önce bir ön kontrol seçeneği talep ediyor ve eşleştirme eylemi bulamıyor.

public HttpResponseMessage Options() 
{ 
    return new HttpResponseMessage { StatusCode = HttpStatusCode.OK }; 
} 

IIS nasıl yapılandırıldığına bağlı olarak, aynı zamanda seçenekler

<system.webServer> 
    <security> 
     <requestFiltering> 
     <verbs applyToWebDAV="false"> 
      <add verb="OPTIONS" allowed="true" />          
     </verbs> 
     </requestFiltering> 
    </security> 
<system.webServer> 

Ayrıca Açısal belirterek emin Content-Type yapmak web.config talep izin vermeniz gerekebilir

var req = { 
    // ... 
    headers: 
     'Content-Type': 'application;x-www-form-urlencoded'     
    }, 
    // .. 
};