Question

我必须从以下GET服务获取JSON数据

http://localhost:8080/test/GetAllLocation

当我在我的浏览器中点击上面的URL时，这给了我JSON数据。但我无法将JSON数据存入我的AngularJS应用程序。

我的控制器代码在下面给出

(function () {
    angular
        .module('app')
        .controller('VisitorsController', [ 'myService', VisitorsController])
        .factory("myService", ['$http', function($http) {
            return {
                getResponders: function(servicesUrl) {
                    return $http.get(servicesUrl).then(function(response) {
                        console.log(response.status);
                        return response.data;
                    }).catch(function(response) {
                        console.log(response.status);
                        return response.data;
                    });
                }
            };
            return myService;
        }]);

    function VisitorsController(myService) {
        var vm = this;
        var servicesUrl = 'http://localhost:8080/test/GetAllLocation';
        myService.getResponders(servicesUrl).then(function(data) {
            console.log(data);
            if(data==null) {
                console.log(data);
            } else {
                console.log(data);
            }
        }).catch(function(response) {
            console.log(response.status);
            return response.data;
        });

        vm.visitorsChartData = [ {key: 'UP', y: 5264}, { key: 'Critical', y: 3872},{key: 'Warning', y: 1000} ];
        vm.chartOptions = {
            chart: {
                type: 'pieChart',
                height: 210,
                donut: true,
                x: function (d) { return d.key; },
                y: function (d) { return d.y; },
                valueFormat: (d3.format(".0f")),
                color: ['rgb(0, 150, 136)', '#E75753','#fbbc05'],
                showLabels: false,
                showLegend: false,
                title: 'Over 9K',
                margin: { top: -10 }
            }
        };
    }
})();

当我运行此应用程序时，这将给我以下错误

AngularJS POST http://localhost:8080/test/GetAllLocation 405 (Method Not Allowed)
XMLHttpRequest cannot load http://localhost:8080/test/GetAllLocation. No 'Access-Control-Allow-Origin' header is present on the requested resource.The response had HTTP status code 405.

Answer 1

您的问题是CORS。我会在CORS上做一些阅读。特别是“请求资源上存在”No'Access-Control-Allow-Origin'标题“会让您相信问题与标题有关。

问题还可能是服务器没有为CORS正确配置，但是在角度方面尝试在应用程序设置中设置$ HTTP的选项，这是我的Django示例：

这会更改具有XSRF令牌的标头名称，该令牌已具有默认值（请参阅doc）。实际的标题名称可能需要更改，我不确定您的服务器端实现。如果您正在使用Django让我知道，我有更多的Django配置数据。

这是一个类似的post

Answer 2

您正在向public class Testing { private static int InfThanZero(int[] elems) { int i = 0; for (int element : elems) { if (element < 0) { i++; } } return i; } public static void main(String[] args) { int sum = 0; for (String s : args) { if (Integer.parseInt(s) < 0) { sum++; } } System.out.println(sum); } }发出API请求，但您的客户端正在不同的Web服务器/端口上运行。理想情况下，您应该让您的客户端在同一台服务器上运行，而不是允许 CORS 。

如果应用程序因安全问题向其他服务器发出API请求，则您的浏览器会阻止API请求。但是，可以通过在API上设置http://localhost:8080标头来允许这样做。

根据'Access-Control-Allow-Origin'上运行的服务器类型，您需要在API上设置http://localhost:8080标头。您可以选择允许特定域或所有域（'Access-Control-Allow-Origin'）获得对API的编程访问。

AngularJS POST http：// localhost：8080 / test / GetAllLocation 405（方法不允许）

2 个答案: