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

0

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

XMLHttpRequest не может загрузить http://localhost: 8080/WebService. В запрошенном ресурсе нет заголовка "Access-Control-Allow-Origin". Происхождение ' http://localhost ', следовательно, не допускается.

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

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

Затем другое решение предложило переместить проект на сервер. Поэтому я переместил проект в папку 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'];
}]);

Вопрос остался.

  • 0
    Привет, если ты еще этого не сделал. Попробуйте добавить приведенный ниже код в ваше угловое приложение, надеюсь, проблема будет решена. your_app_name.config(['$httpProvider', function($httpProvider) { $httpProvider.defaults.useXDomain = true; delete $httpProvider.defaults.headers.common['X-Requested-With']; }]);
  • 0
    Да, я забыл упомянуть, что тоже пробовал. Та же проблема.
Показать ещё 4 комментария
Теги:
wamp
cross-domain

1 ответ

0

Я столкнулся с той же проблемой при разработке собственного веб-приложения. Это проблема 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
    });

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

  • 0
    Извините за неработающий URL, я набираю это на моем телефоне
  • 0
    Да, я тоже видел это решение. Но это позволяет только для запросов GET. И, как я уже говорил, мой веб-сервис - REST, поэтому мне нужно использовать все различные HTTP-глаголы :(

Ещё вопросы

Сообщество Overcoder
Наверх
Меню