CORS Probleme mit angularjs $ http

Question

Ich bekomme Probleme bei der Verwendung von angularjs $ http in einer CORS-Anfrage, meine Erfolgsfunktion authenticateSuccess (Daten, Status, Header) bekommen falsche Header. Wie wir wissen, wird jede CORS-Anfrage zweimal in angularjs sein, ich bekomme zweimal Antwort vom Server, das erste Mal ist die Korsvalidierungsinformation, die zweite ist benötigte Antwort, aber meine Erfolgsfunktion erhält die Header in der ersten Antwort. Aber es sind Daten von der zweiten Antwort.

function login(credentials) { 

     var data = { 
      username: credentials.username, 
      password: credentials.password, 
      rememberMe: credentials.rememberMe 
     }; 
     console.log(data); 
     return $http.post('//localhost:8080/api/authenticate', data).success(authenticateSuccess); 

     function authenticateSuccess(data, status, headers) { 
      console.log(headers()); 
      console.log(data); 
      var bearerToken = headers('Authorization'); 
      if (angular.isDefined(bearerToken) && bearerToken.slice(0, 7) === 'Bearer ') { 
       var jwt = bearerToken.slice(7, bearerToken.length); 
       service.storeAuthenticationToken(jwt, credentials.rememberMe); 
       return jwt; 
      } 
     } 
    } 

Answer 1

Sie erhalten dieses Problem als Header, die Sie zu senden sind, ist nicht mit den Headern in Backend angepasst

So lassen Im Frontend nehme an, Sie zu senden Header

contentHeaders = new Header(); contentHeaders.append ('Autorisierung', 'Ihr Token'); contentHeaders.append ('Content-Type', 'application/json'); contentHeaders.append ('Access-Control-Allow-Origin', '*');

Also sollten diese Header wie 'Authorization', 'Content-Type', 'Access-Control-Allow-Origin' mit Ihrer Kopfzeile im Backend übereinstimmen.

So in Backend 'Access-Control-Allow-Headers' sollten alle oben Header unter

res.header ("Access-Control-Allow-Origin", "*") zu sehen haben; res.header ("Access-Control-Allow-Headers", "Autorisierung, Inhaltstyp, Access-Control-Allow-Origin");

Also hier in Access-Control-Allow-Header müssen Sie alle Header übergeben, die Sie von Frontend senden: 'Authorization', 'Content-Typ', 'Access-Control-Allow-Origin'.

Es funktioniert perfekt, wenn Sie das obige Konzept verwenden.

Danke