Ionic Error Fetching Local API

Question

В настоящее время я разрабатываю приложение Ionic, которое извлекается из внешнего API. Поскольку этот API также разработан сам, все локально. API возвращает массив JSON.

Мой текущий контроллер выглядит следующим образом:

app.controller('ListController', ['$scope', '$http', function($scope, $http){ 
     $http.get('http://localhost:8080/api/getPoi/merzouga').success(function(data){ 
     $scope.pois = data; 
    }); 
}]); 

Проблема заключается в том, что, когда я пытаюсь загрузить это на мой взгляд, я получаю следующее сообщение об ошибке:

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

Я не знаю, если это актуально, но Ionic обслуживается на порту 8100 и API на 8080.

Любая идея о том, как я могу проверить это локально?

Answer 1

Установите и включите плагин CORS в своем браузере.

Answer 2

Браузер говорит вам, как решить проблему. Поскольку у вас есть API в другом порту, вам необходимо отправить заголовок «Access-Control-Allow-Origin» вместе с ответом (на стороне сервера). Предположим, вы используете Express, это будет так:

res.header('Access-Control-Allow-Headers', 'Content-Type'); 
res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS'); 
res.header('Access-Control-Allow-Origin', '*'); 

Или еще лучше, вы можете просто использовать промежуточное программное обеспечение для этого: https://www.npmjs.com/package/cors