CORS jQuery Gönderen Ama AngularJs ile Başarısız

Question

AngularJS kullanarak aramak istediğim CORS özellikli Java Spring API'm var. İlk önce CORS'i test etmek için bir jQuery kodu yazdım ve mükemmel çalıştı. Sonra hep aynı hatayı üretir eşdeğer angularjs kod yazdım - En sonuçları CORS isteklerini yaparken herhangi bir değişiklik angularjs gereklidir söylemek angularjs gelen CORS isteklerini yapma konusunda araştırma On

XMLHttpRequest cannot load http://localhost:8080/my_project_name/api/get_some_data. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access. The response had HTTP status code 401. 

ama görünmüyor çalışmak. Yanlış ya da eksik yaptığım bir şey var mı? BTW AngularJS v1.3.15 kullanıyorum.

ardından I (BaseWebConfigWebMvcConfigurerAdapter genişletir) Bahar uygulamasında CORS'yi sağladı nasıl -

public class WebConfig extends BaseWebConfig { 

    @Override 
    public void configureMessageConverters(List<HttpMessageConverter<?>> converters) { 
     super.configureMessageConverters(converters); 
     ResourceHttpMessageConverter resourceHttpMessageConverter = new ResourceHttpMessageConverter(); 
     converters.add(resourceHttpMessageConverter); 
    } 

    @Override 
    public void addCorsMappings(CorsRegistry registry) { 
     // allow cross-origin API requests 
     registry 
       .addMapping("/api/**") 
       .allowedMethods(
         HttpMethod.GET.name(), 
         HttpMethod.HEAD.name(), 
         HttpMethod.POST.name(), 
         HttpMethod.PUT.name(), 
         HttpMethod.OPTIONS.name()) 
       .allowCredentials(false); 
    } 

} 

ben ilk mükemmel çalışır aşağıdaki gibi bir jQuery kodu kullanılarak CORS'yi test - Sonra

$(function() { 
       $('#submit_jquery').click(function() { 
        var token = $('#token').val().trim(); 
        var headerValue = "Bearer " + token; 
        var body = $('#body').val().trim(); 
        var domain = $('#api_domain').val().trim(); 
        $('#result').text(''); 
        $.ajax({ 
         method : 'POST', 
         url : domain + '/api/get_some_data', 
         contentType : 'application/json', 
         data : body, 
         beforeSend : function(xhr) { 
          xhr.setRequestHeader("Authorization", headerValue); 
         }, 
         success : function(json) { 
          console.log('success'); 
          $('#result').html('<pre>' + JSON.stringify(json, undefined, 2) + '</pre>'); 
         }, 
         error : function(xhr, textStatus, errorThrown) { 
          console.log('error'); 
         }, 
         complete : function() { 
          console.log('complete'); 
         } 
        }); 
        return false; 
       }); 
      }); 

Aşağıdaki gibi bir eşdeğer AngularJS kodu yazdım -

app.controller('CorsController', ['$scope', '$http', 
       function($scope, $http) { 
        $scope.makeCorsRequest = function() { 
         var token = $('#token').val().trim(); 
         var headerValue = "Bearer " + token; 
         var body = $('#body').val().trim(); 
         var domain = $('#api_domain').val().trim(); 
         var url = domain + '/api/get_some_data'; 
         var header = {'Authorization': headerValue, 'Content-Type': 'application/json'}; 

         $http({ 
          method: 'POST', 
          url: url, 
          header: header, 
          data: body 
         }).then(
           //success callback 
           function (data) { 
            console.log('SUCCESS'); 
            console.log(data); 
           }, 
           //error callback 
           function (errorMessage) { 
            console.error('ERROR'); 
            console.error(errorMessage); 
           } 
         ); 
        }; 
       }]); 

jQuery'den çağrıldığında API yanıt başlığı aşağıdaki gibidir. İlk tepkinin

Üstbilgi - - İkinci tepkinin

Access-Control-Allow-Headers:accept, authorization, content-type 
Access-Control-Allow-Methods:GET,HEAD,POST,PUT,OPTIONS 
Access-Control-Allow-Origin:* 
Access-Control-Max-Age:1800 
Allow:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH 
Content-Length:0 
Date:Mon, 28 Mar 2016 10:30:00 GMT 
Server:Apache-Coyote/1.1 
Vary:Origin 

Başlığını - Daha CORS'yi etkinleştirmediğinizden

Access-Control-Allow-Origin:* 
Cache-Control:no-cache, no-store, max-age=0, must-revalidate 
Content-Type:application/json 
Date:Mon, 28 Mar 2016 10:30:00 GMT 
Expires:0 
Pragma:no-cache 
Server:Apache-Coyote/1.1 
Transfer-Encoding:chunked 
Vary:Origin 
X-Content-Type-Options:nosniff 
X-Frame-Options:DENY 
X-XSS-Protection:1; mode=block 

Answer 1

İki çağrı aslında tarayıcı tarafından yapılır. Access-Control-Allow-Origin başlığında CORS için * olarak ayarlanacak başlık gereklidir.

.allowedOrigins("http://localhost:8000"); ile veya daha iyisi .allowedOrigins("*");'u kullanın. https://spring.io/guides/gs/rest-service-cors/

401'dan itibaren, kimlik doğrulamasında bir hata olduğuna inanıyorum. Aşağıda verilen 'u header yerine kullanın ve bunun işe yarayıp yaramadığını kontrol edin.

$http({ 
    method: 'POST', 
    url: url, 
    headers: header, //use headers here 
    data: body 
})