AngularJS: разрешить кросс-доменный запрос AJAX

Question

Я пытаюсь вызвать веб-службу REST из своего нового приложения с угловыми углами. Когда сделан запрос я получаю эту ошибку:

XMLHttpRequest cannot load http://localhost:8080/WebService . No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost ' is therefore not allowed access.

я узнал, что это происходит потому, что браузер не позволяет такие действия.

В StackOverflow one of the solutions было отключено несколько параметров безопасности. Я попытался сделать это, и это не сработало, я получал ту же ошибку.

Затем another solution предложил переместить проект на сервер. Поэтому я перенес свой проект в папку www в WAMP. Это не сработало, потому что мне нужно активировать headers_module, а затем изменить httpd.conf добавив следующее:

<IfModule mod_headers.c> 
    Header set Access-Control-Allow-Origin: * 
</IfModule> 

Так что я активировал модуль и изменил общий конфигурационный файл (не помню, как это сделать просто сформировать свою сеть проект) и перезапустил WAMP. Это все равно не сработает.

Единственное, что я мог сделать, чтобы заставить его работать, - создать веб-проект в Eclipse JEE и запустить его на сервере Tomcat. Но я действительно не хочу этого делать.

Как исправить эту проблему?

Редактировать Я также попытался добавить это к моему угловому приложение:

app.config([ '$httpProvider', function($httpProvider) { 
    $httpProvider.defaults.useXDomain = true; 
    delete $httpProvider.defaults.headers.common['X-Requested-With']; 
}]); 

Проблема осталась.

Answer 1

Я столкнулся с такой же проблемой при разработке собственного веб-приложения. Это проблема CORS. То, что я сделал, чтобы пройти мимо, называется JSONP (JSON-Padding). Этот подход полностью игнорирует CORS. К счастью, служба angularjs $ html позволяет использовать JSONP.

Я отсылаю вас к следующей части angularjs документации: https://docs.angularjs.org/api/ng/service/ $ HTTP

Важным понятием для JSONP является обратный вызов, который, по существу, что вы будете отступы (далее «P» в JSONP) JSON с. Обратный вызов передается в качестве параметра в HTTP-запросе.

Вот несколько примеров кода, который я использую в моем веб-приложение

(Мой PHP слой, который скрывает свой ключ разработчика и вызывает API третьей стороны):

$method = isset($_GET['method']) ? $_GET['method'] : ''; 

//Check for a callback, which is needed for JSONP 
if(isset($_GET['callback'])){ 

    //Check which method is being called. 
    //I use method to abstract out the long urls of api's 
    if($method == 'get_data_a'){ 

     $url = 'https://some.api.url?api_key='.$key; 
     $response = file_get_contents($url); 

     //Pad the JSON response with a function named after the callback for JSONP 
     //You're returning something that looks like 
     //myCallbackName(myJSONString); 
     echo $_GET['callback'] . '(' . $response . ')'; 

    } 
    else if ($method == 'get_data_b'){ 
     .... 
    } 
} 

(Мой код приложения - AngularJS)

//I reference my php layer for REST services ; callback=JSON_CALLBACK as per angularjs documentation 
var url = my_php_layer_url + '?method=get_data_a&callback=JSON_CALLBACK'; 

//Call webservice using angularjs $http and the shortcut method for JSONP 
$http.jsonp(url) 
    .success(function (result) { 
     //do whatever you want with the result; the result is properly formatted JSON 
    }) 
    .error(function (data, status) { 
     //do whatever you want with the error 
    }); 

Надеюсь, это вам поможет.