Angular $http.get 总是在使用本地 Restful 服务时出现错误

Question

我有一个错误，我很困惑，我使用 Jersey 创建了一个简单的 Java EE 7 项目。

我将在我的休息服务中返回这门课：

@XmlRootElement
public class LocationDTOx {

    private Long id;        
    private String tittle;    
    private String description;        
    private Long parent;

    //Getter and setters...

在我的服务类中，我有：

@Path("/location")
public class LocationService {

    @GET
    @Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.APPLICATION_JSON)
    @Path("/findlocation")
    public LocationDTOx findLocation() {
        System.out.println("findlocation");
        try {
            LocationDTOx x = new LocationDTOx();
            x.setDescription("Description");
            x.setId(0l);
            x.setParent(null);
            x.setTittle("Tittle ...");
            return x;
        } catch (Exception ex) {
            Logger.getLogger(LocationService.class.getName()).log(Level.SEVERE, null, ex);
        }
        return null;
    }    

}

如果我把它放在我的浏览器中，我 100% 确定我的休息是正常的：

http://localhost:8080/BIReportL-war/rest/location/findlocation

我得到这个 Json 字符串：

{"description":"Description","id":0,"title":"Tittle ..."}

这笔交易在我的角度代码中，我从角度调用其余服务的代码正在执行，但它只是给了我错误部分：

app.controller('questionsController', function ($scope, $http) {
    //var url = "http://localhost:8080/BIReportL-war/rest/location/findlocation";
    //var url = "http://www.w3schools.com/angular/customers.php";
    var url = "http://127.0.0.1:8080/BIReportL-war/json.json";
    $http.get(url)
        .success(
            function (data, status, headers, config) {
                alert("success");   
            })
        .error(function(data, status, headers) {
          alert('Repos status ' + status + ' --- headers : ' + headers);
        })
        .finally(
            function() {
        });
});

我与 cmets 有另一个本地 URL 到一个虚拟 json 文件，我可以通过该浏览器访问它，并且我得到相同的结果一个错误，奇怪的是我尝试使用这个 rest public json 文件：

http://www.w3schools.com/angular/customers.php

我成功了！！我不知道为什么，我在做什么或我有什么问题，我的意思是当我尝试使用我的本地休息服务时，我看到它在日志中被调用，这是事实，但角度客户端正在出错了。

提前感谢您的帮助！

我正在使用： *玻璃鱼V4 *角度

好吧，关于CORS问题，我只是把我的休息如下，所以这里是解决方案：

@Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.APPLICATION_JSON)
    @Path("/findlocation")
    public Response findLocation() {
        System.out.println("findlocation");
        try {
            LocationDTOx x = new LocationDTOx();
            x.setDescription("Description");
            x.setId(0l);
            x.setParent(null);
            x.setTittle("Tittle ...");

            return Response.ok()
                    .entity(x)
                    .header("Access-Control-Allow-Origin", "*")
                    .header("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT")
                    .build();
        } catch (Exception ex) {
            Logger.getLogger(LocationService.class.getName()).log(Level.SEVERE, null, ex);
        }
        return null;
    }   

Answer 1

如果 AngularJS 正在访问您的本地 REST API，事实上您是在 不同端口 上的浏览​​器中运行它，根据 CORS 规则（单独端口表示不同的来源）。

如果协议、端口（如果一个是 指定），并且主机对于两个页面都是相同的。

对于您的 Access-Control-Allow-Origin 响应标头，通过 * 将其设置为全部，或明确指定备用端口。这与您的浏览器（和 AngularJS）试图遵守规则有关，您可以在 MDN's page on same origin policy 上找到这些规则。

当您直接在浏览器中加载资源时，这些“规则”不适用，因为来源（您的浏览器从中加载的页面）与您加载时的端口相同只是资源，在那个来源（加上端口）。

[编辑]

CORS 标准包括遵守某些响应标头，例如 Access-Control-Allow-Origin 和 Access-Control-Allow-Methods。

参考资料：

• MDN's page on access control
• HTML5Rocks.com tutorial on CORS

[/编辑]

Answer 2

您的 Jersey 服务使用 GET (@GET)，而您的 Angular 客户端使用 POST ($http.post(url))。

将 Angular 代码更改为 $http.get 即可。

您的 http://www.w3schools.com/angular/customers.php 示例正在工作，因为它同时响应 POST 和 GET，但是对于您的场景，GET 显然是正确的 HTTP 动词。

Answer 3

您是否尝试使用相对 url？ var url = "/BIReportL-war/json.json";

你能在这里发布整个错误吗？

我同意 @pankajparkar 的观点，这可能是 CORS 问题。

（抱歉发布这个“答案”，我没有足够的积分给 cmets）