Получение JSON из URL-адреса в AngularJS?

У меня есть сервер node.js, предоставляющий приложение AngularJS через порт 8000, и сервер Python, предоставляющий данные через HTTP как JSON через порт 80.

Загрузка в моем браузере http://localhost:8000/app/List.html отображает пустую страницу. Почему?

Контроллеры.js

function FooListCtrl($scope, $http) {
    $http.get('localhost/foo/list').success(function (data) {
        $scope.foo_lists = data;
    });
}

FooListCtrl.$inject = ['$scope', '$http'];

Список.html

<!doctype html>
<html lang="en" ng-app>
    <head>
        <meta charset="utf-8">
        <script src="lib/angular/angular.js"></script>
        <script src="js/controllers.js"></script>
    </head>
    <body ng-controller="FooListCtrl">
        <code>{{foo_lists | json}}</code>
    </body>
</html>

curl -X ПОЛУЧИТЬ localhost/foo/list -i

HTTP/1.0 200 OK
Date: Wed, 15 May 2013 18:28:49 GMT
Server: WSGIServer/0.1 Python/2.7.4
Content-Length: 30
Content-Type: application/json

{"Foo": ["bar", "can", "haz"]}

person Foo Stack    schedule 15.05.2013    source источник
comment
Как получить доступ к index.html. С веб-сервера или как file://? Разрешает ли ваш сервер перекрестные запросы?   -  person TheHippo    schedule 15.05.2013
comment
@TheHippo OP включил URL-адрес, который он использует, и упомянул, что он загружается в браузере. XHR не включает схему http://, но все равно должен работать. Вы пытались использовать $scope.$apply() внутри обратного вызова success()? Я думал, что служба $http справится с этим, но, возможно, нет.   -  person jkoreska    schedule 15.05.2013
comment
@jkoreska Ты прав. Но он также упоминает, что html поступает с порта 8000, а JSOn — с порта 80, поэтому похоже, что это все еще проблема кросс-организации.   -  person TheHippo    schedule 15.05.2013
comment
О, так мне нужно обслуживать JSON с того же сервера + порта, что и статический/клиентский контент? - Странно. Как тогда я буду использовать сторонние API?   -  person Foo Stack    schedule 15.05.2013
comment
@TheHippo Вы, сэр, тоже правы! FooStack — по умолчанию ваш браузер будет запрашивать только исходную схему/хост/порт — см. en.wikipedia. org/wiki/Same_origin_policy   -  person jkoreska    schedule 16.05.2013
comment
Основные понятия описаны здесь: en.wikipedia.org/wiki/Cross-origin_resource_sharing Почему бы не передать HTML через сервер Python через порт 80?   -  person TheHippo    schedule 16.05.2013


Ответы (1)


Проблема, скорее всего, как уже упоминали другие, проблема кросс-происхождения. Речь идет не только об использовании одного и того же домена, но и одного и того же порта. Чтобы обойти это, вы можете либо использовать JSONP, что является очень простым решением. специально для этой цели, или используйте защиту от подделки межсайтовых запросов (XSRF). , который использует проверку файлов cookie и другие меры для обеспечения безопасности, обеспечивая при этом функции получения и публикации (это не самое простое решение).

person Justin L.    schedule 15.05.2013