CORS問題使用angularjs $ http

我在CORS請求中使用angularjs $ http時遇到問題，我的成功函數authenticateSuccess（數據，狀態，頭文件）得到錯誤的頭文件。正如我們所知，每個CORS請求將在angularjs中兩次，我從服務器獲得兩次響應，第一次是cors驗證信息，第二次是需要響應，但是我的成功函數在第一個響應中獲取頭文件。但數據來自第二反應。

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; 
      } 
     } 
    }

來源

2016-07-27 盧俊星

棄用'$ http'''.success'處理程序。改爲使用'.then'。 https://docs.angularjs.org/api/ng/service/$http#deprecation-notice – Phil

是的，我已經改變它使用.then。但是我遇到了同樣的問題，標題是從第一次響應開始，數據來自第二次響應。 –

您收到此問題，因爲您要發送不與後端標題匹配標題

因此，讓我們假設在前臺你發送消息頭

contentHeaders =新頭（）; contentHeaders.append（'Authorization'，'your token'）; contentHeaders.append（'Content-Type'，'application/json'）; contentHeaders.append（'Access-Control-Allow-Origin'，'*'）;

因此，像'Authorization'，'Content-type'，'Access-Control-Allow-Origin'這樣的頭文件應該與您的頭文件允許在後端匹配。

所以在後端的訪問控制允許報頭'應該有上述所有頭見下文

res.header（「訪問控制允許來源」，「*」）; res.header（「Access-Control-Allow-Headers」，「Authorization，content-type，Access-Control-Allow-Origin」）;

因此，在Access-Control-Allow-Headers中，您必須傳遞您從前端發送的所有標題：'授權'，'內容類型'，'訪問控制允許源'。

當您使用上述概念時，它將很好地工作。

謝謝

來源

2017-06-07 16:12:21

CORS問題使用angularjs $ http

回答

相關問題