.NET Web API 2 mit CORS und Angular arbeitet nicht am ersten Beitrag

Question

Ich benutze. NET ASP Web API V2 mit Angular 1 und Auth0.

Nach Erstanmeldung durch Auth0 ich die folgende Störung erhalte:

XMLHttpRequest cannot load localhost:3001/profile. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:62379' is therefore not allowed access. The response had HTTP status code 500.

Wenn ich refresh ich nicht mehr den Fehler. Wenn ich die Browserdaten lösche, erhalte ich den Fehler erneut, aber erhalte Erfolg nach einer Aktualisierung.

Ich habe CORS in der API-Konfiguration mit den erforderlichen NUGET-Paketen aktiviert.

Ich habe folgende Lösungen ausprobiert, weil ich dachte, das eine vor dem Flug Frage war:

1) Umgang mit dem Verb SELECT auf dem Controller und global durch das Abfangen der Anforderung. http://www.jefclaes.be/2012/09/supporting-options-verb-in-aspnet-web.html

2) Hinzufügen des Auswahlverbs als eines der akzeptierten Verben auf der Controller-Methode.

3) Verschiedene Antworten, die ich hier gefunden habe, um die Anfrage zu ändern. ** Ich kann keine Links teilen, mein Rep ist zu niedrig.

usw.

4) einen bestimmten Ursprung anstelle von *

Der Controller:

[Route("profile")] 
    [EnableCors(origins: "*", headers: "*", methods: "OPTIONS")] 
    public HttpResponseMessage Options() 
    { 
     var resp = new HttpResponseMessage(HttpStatusCode.OK); 
     resp.Headers.Add("Access-Control-Allow-Origin", "*"); 
     resp.Headers.Add("Access-Control-Allow-Methods", "*"); 
     return resp; 
    } 


    [Route("profile")] 
    [EnableCors(origins: "*", headers: "*", methods: "POST")] 
    [HttpPost] 
    public object Post([FromBody]dynamic data) 
    { 
     string email = null; 
     var b = new object(); 
     try 
     { 
     **** Logic **** 
     } 
     catch (Exception ex) 
     { 
     **** Return Error **** 
     } 

     return b; 
    } 

API Config

public static class WebApiConfig 
{ 
    public static void Register(HttpConfiguration config) 
    { 
     var cors = new EnableCorsAttribute(
      origins: "*", 
      headers: "*", 
      methods: "*"); 

     // Web API configuration and services 
     config.EnableCors(cors); 

     var clientID = WebConfigurationManager.AppSettings["auth0:ClientId"]; 
     var clientSecret = WebConfigurationManager.AppSettings["auth0:ClientSecret"]; 

     config.MessageHandlers.Add(new JsonWebTokenValidationHandler() 
     { 
      Audience = clientID, // client id 
      SymmetricKey = clientSecret // client secret 
     }); 

     // Web API routes 
     config.MapHttpAttributeRoutes(); 

     config.Routes.MapHttpRoute(
      name: "DefaultApi", 
      routeTemplate: "api/{controller}/{id}", 
      defaults: new { id = RouteParameter.Optional } 
     ); 
    } 





} 

Die Winkel Anfrage

function postLogin() { 
      var loginPackage = []; 
      if (token === null) token = store.get('token'); 
      if (store.get('profile') != null) { 
       loginPackage = store.get('profile'); 
      } 

      return $q(function(resolve, reject) { 
       $http({ 
         method: 'Post', 
         url: BASE + 'profile', 
         data: loginPackage, 
         crossDomain: true, 
         xhrFields: { 
          withCredentials: true 
         }, 
         contentType: 'application/json' 
        }) 
        .success(function(data, status) { 
         *** Logic *** 
         resolve(function() { 
          resolve(true); 
         }); 
        }) 
        .error(function(data, status) { 
          reject(function() { 

          }); 
        }); 
      }); 

     } 

Ich glaube, ich habe mich schon zu lange damit beschäftigt und etwas ziemlich Einfaches übersehen.

//// **** aktualisieren **** ////

Antwort:

HTTP/1.1 500 Internal Server Error 
Cache-Control: no-cache 
Pragma: no-cache 
Content-Type: application/json; charset=utf-8 
Expires: -1 
Server: Microsoft-IIS/10.0 
X-AspNet-Version: 4.0.30319 
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcaWFteWFcRGVza3RvcFxOZXcgZm9sZGVyICgzKVx3ZWJhcGlcQXBpXHByb2ZpbGU=?= 
X-Powered-By: ASP.NET 
Date: Sun, 08 Jan 2017 00:17:26 GMT 
Content-Length: 709 

// * UPDATE * ///

Mit einem sauber Browser-Cache REQUEST (Fehler)

POST /profile HTTP/1.1 
Host: localhost:3001 
Connection: keep-alive 
Content-Length: 2372 
Accept: application/json, text/plain, */* 
Origin: http://localhost:62379 
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 
Authorization: Bearer null 
Content-Type: application/json;charset=UTF-8 
Referer: http://localhost:62379/index.html 
Accept-Encoding: gzip, deflate, br 
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6 

Ich dachte, dies könnte der Vorflug sein, aber es ist mein Verständnis, dass mit dem Verb OPTIONS nicht das Verb POST sein würde.

Die Autorisierung ist nicht richtig durch das Aussehen davon festgelegt.

Authorization: Bearer null 

Die Antwort:

HTTP/1.1 500 Internal Server Error 
Cache-Control: no-cache 
Pragma: no-cache 
Content-Type: application/json; charset=utf-8 
Expires: -1 
Server: Microsoft-IIS/10.0 
X-AspNet-Version: 4.0.30319 
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcaWFteWFcRGVza3RvcFxOZXcgZm9sZGVyICgzKVx3ZWJhcGlcQXBpXHByb2ZpbGU=?= 
X-Powered-By: ASP.NET 
Date: Sun, 08 Jan 2017 00:31:49 GMT 
Content-Length: 709 

Ein zweiter Beitrag gesendet wird sofort nach und ist erfolgreich.Es ist eigentlich der Vorflug.

Die Anfrage:

OPTIONS /profile HTTP/1.1 
Host: localhost:3001 
Connection: keep-alive 
Access-Control-Request-Method: POST 
Origin: http://localhost:62379 
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 
Access-Control-Request-Headers: authorization, content-type 
Accept: */* 
Referer: http://localhost:62379/index.html 
Accept-Encoding: gzip, deflate, sdch, br 
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6 

Und die Antwort:

HTTP/1.1 200 OK 
Cache-Control: no-cache 
Pragma: no-cache 
Expires: -1 
Server: Microsoft-IIS/10.0 
Access-Control-Allow-Origin: * 
Access-Control-Allow-Headers: authorization,content-type 
X-AspNet-Version: 4.0.30319 
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcaWFteWFcRGVza3RvcFxOZXcgZm9sZGVyICgzKVx3ZWJhcGlcQXBpXHByb2ZpbGU=?= 
X-Powered-By: ASP.NET 
Date: Sun, 08 Jan 2017 00:34:43 GMT 
Content-Length: 0 

dies, weil ich nicht über die Login-Ansicht bekommen. Der Ladebildschirm sitzt auf Fehler. Wenn ich mich aktualisiere und mich erneut anmelde, gibt es keinen Fehler.

Die Anfrage:

POST /profile HTTP/1.1 
Host: localhost:3001 
Connection: keep-alive 
Content-Length: 2367 
Accept: application/json, text/plain, */* 
Origin: http://localhost:62379 
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwczovL3ltdC5hdXRoMC5jb20vIiwic3ViIjoiZmFjZWJvb2t8MTAxNTM4MjIxOTc4MTIyNTEiLCJhdWQiOiJWWDhHMFMyUWM5cUFjYnRrM09pMVZMa2NkWGxnWlBtZSIsImV4cCI6MTQ4Mzg3MTMyNywiaWF0IjoxNDgzODM1MzI3fQ.HBQcGC6aad2pLaq3nPuhojrFT2b6Usv64p97b-DCRCU 
Content-Type: application/json;charset=UTF-8 
Referer: http://localhost:62379/index.html 
Accept-Encoding: gzip, deflate, br 
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6 

Das Berechtigungsfeld jetzt hat das Token anstelle der Nullwert:

Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwczovL3ltdC5hdXRoMC5jb20vIiwic3ViIjoiZmFjZWJvb2t8MTAxNTM4MjIxOTc4MTIyNTEiLCJhdWQiOiJWWDhHMFMyUWM5cUFjYnRrM09pMVZMa2NkWGxnWlBtZSIsImV4cCI6MTQ4Mzg3MTMyNywiaWF0IjoxNDgzODM1MzI3fQ.HBQcGC6aad2pLaq3nPuhojrFT2b6Usv64p97b-DCRCU 

Die Antwort ist Erfolg und Anmeldung wird fortgeführt.

Das Token scheint nur nach einer Aktualisierung injiziert zu werden.

Mein AUTH0 Config ist:

authProvider.init({ 
     domain: A0_DOMAIN, 
     clientID: A0_CLIENT, 
     callbackUrl: location.href, 
     loginState: 'out.login', 
     options:options 
    }); 



    var refreshingToken = null; 
    jwtInterceptorProvider.tokenGetter = function(store, jwtHelper) { 
     var token = store.get('token'); 
     var refreshToken = store.get('refreshToken'); 
     if (token) { 
      if (!jwtHelper.isTokenExpired(token)) { 
       return store.get('token'); 
      } else { 
       if (refreshingToken === null) { 
        refreshingToken = auth.refreshIdToken(refreshToken) 
         .then(function(idToken) { 
          store.set('token', idToken); 
          return idToken; 
         }) 
         .finally(function() { 
          refreshingToken = null; 
         }); 
       } 
      } 
     } 

    }; 

    jwtOptionsProvider.config({ 
     whiteListedDomains: ['localhost','https://www.ymtechno.com','https://www.ymtechno.com/_api','https://ymtechno.com/_api'] 
    }); 

    $httpProvider.interceptors.push('jwtInterceptor'); 

}) 
.run(function($rootScope, auth, store, jwtHelper, $location) { 
    var refreshingToken = null; 
    $rootScope.$on('$locationChangeStart', 
     function() { 
      var token = store.get('token'); 
      var refreshToken = store.get('refreshToken'); 
      if (token) { 
       if (!jwtHelper.isTokenExpired(token)) { 
        auth.authenticate(store.get('profile'), token); 
       } else { 
        if (refreshingToken === null) { 
         refreshingToken = auth.refreshIdToken(refreshToken) 
          .then(function(idToken) { 
           store.set('token', idToken); 
           return idToken; 
          }) 
          .finally(function() { 
           refreshingToken = null; 
          }); 
         return refreshingToken; 
        } else { 
         $location.path('login'); 
        } 
       } 
      } 

     }); 

    auth.hookEvents(); 

Answer 1

Nach der Untersuchung fand ich die Abfangjäger nicht wurde das Token in die Auth-Header setzen, bis die Anwendung neu gestartet wurde. Dies wurde als CORS-Fehler gelesen, da die Anforderung die Kriterien für den Zugriff auf die API nicht erfüllte. Der Token-Wert war nicht definiert.

Set HTTP header for one request

in dem Fall, dass Sie in der gleichen Ausgabe kommen es ist ein nützlicher Hinweis:

Eine mehr in die Tiefe Thread über Injektoren und Header finden Sie hier.