2015-08-18 3 views
0

Я пытаюсь научиться использовать запросы $ http.get в AngularJS для веб-приложения, которое я пишу. У меня есть локально размещенный сервер, на котором есть API, который я написал. Когда я пытаюсь запустить мою страницу «Угловая», я вижу на консоли своего сервера, что запрос GET был выполнен, но ничего не загружается в браузере. После проверки консоли браузера я нахожу это сообщение об ошибке:

XMLHttpRequest cannot load http://127.0.0.1:8080/api/range/?nmax=5&a_max=100&b_max=200, No 'Access-Control-Allow-Origin' header is print on the requested resource. Origin 'null' is therefore not allowed access. 

Серверный Я бегу сервер Python CherryPy, который будет принимать запрос GET на URL выше, и возвращает JSON строку, разыскивая что-то вроде этого:

[ 
    { 
     "a": 5.6, 
     "b": 3.2 
    }, 
    { 
     "a": 4.3, 
     "b": 2.6 
    } 
] 

Вот мой код Угловое, в данный момент это в качестве основных, как это возможно:

<!DOCTYPE html> 
<html> 
<head> 
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
</head> 
<body> 

<div ng-app="myApp" ng-controller="Ctrl"> 

<ul> 
    <li ng-repeat="x in peakdata"> 
    {{ x.a + ', ' + x.b }} 
    </li> 
</ul> 

</div> 

<script> 
var myApp = angular.module('myApp', []); 

myApp.controller('Ctrl', function($scope, $http) { 
    $http.get('http://127.0.0.1:1234/api/range/?nmax=5&a_max=100&b_max=200') 
    .then(function(response){ 
     $scope.peakdata = response.data; 
    }, function(err) { 
     throw err; 
    }); 
}); 
</script> 

</body> 
</html> 

Любые советы будут оценены!

Спасибо, Шон.

Редактировать: Оказывается, что мне пришлось внести поправки как в мой код AngularJS, так и в мой скрипт CherryPy. См. Мой ответ для более подробной информации.

ответ

0

После небольшого дальнейшего исследования, и возились я, наконец, пришел к решению. Мне нужно, чтобы CORS включил мое приложение AngularJS. Был достаточен следующий код:

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

В большинстве случаев людей их проблемы закончились бы там. Однако, поскольку я запускаю собственный сервер CherryPy, мне нужно было немного поработать. Мне пришлось включить CORS в моем скрипте PyryPy Python. Эти вопросы/ответы здесь хорошие ресурсы визави делают это:

“no 'Access-Control-Allow-Origin' header is present” error with Cherrypy

cherrypy/jquery CORS trouble

Для тех, кто интересно, что такое «CORS» на самом деле, это означает «Cross-Origin совместного использования ресурсов» , Страница Википедии - это хороший бит света: https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

0

Я считаю, что этот предыдущий вопрос может иметь ответ, который вы ищете: Origin null is not allowed by Access-Control-Allow-Origin.

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

+0

Хотя этот вопрос не ответил на мой вопрос, он предоставил мне ключевые слова и терминологию, которые я требовал от Google для ответа, который я искал. Большое вам спасибо за это, я отправлю ответ, подробно расскажу, как я решил свою проблему. – Vielbein