如何使用 $resource 从 Angular JS 创建函数调用 @POST RESTful 服务答案

【问题标题】：How to call @POST RESTful service from Angular JS create function using $resource如何使用 $resource 从 Angular JS 创建函数调用 @POST RESTful 服务
【发布时间】：2014-07-18 15:14:46
【问题描述】：

我正在尝试从 Angular-JS 页面调用 Java 后端的 REST 服务。我可以成功获取 GET 数据，但无法调用 @POST 资源。

例如在 Java 后端，这里是我的 RESTful 服务方法 -

@POST
    @Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.APPLICATION_JSON)
    public User create(User user) {
        User usr1 = new User();
        usr1.setId(3);
        usr1.setFirstName("John");
        usr1.setLastName("Paul");

        return usr1;
    }

在 AngularJS 部分，这里是服务工厂：

var app = angular.module('app', ['ngResource']);

app.factory('UsersFactory', function ($resource) {
    return $resource('http://localhost:8080/demoApp/service/users', {}, {
        query: { method: 'GET', isArray: true },
        create: { method: 'POST'}
    })
});

这里是 AngularJS 控制器：

app.controller('userCreationCtrl', ['$scope', 'UsersFactory', '$location',
    function ($scope, UsersFactory, $location) {

        $scope.createNewUser = function () {         
            UsersFactory.create($scope.user);            
        }
   }]);

Chrome 浏览器的 Javascript 控制台中显示错误 -

XMLHttpRequest cannot load http://localhost:8080/demoApp/service/users. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access.

【问题讨论】：

这是一个 CORS 问题，但您说 GET 有效，因此您必须已经部分设置了 CORS。我遇到了同样的问题（CORS 在 GET 请求中工作，但不在 POST 请求中），我使用了无法正常工作的第三方 CORS 过滤器。您使用的是哪个服务器？如果是 Tomcat，它有自己的 CORS 过滤器，效果非常好。

标签： java angularjs rest post

【解决方案1】：

您的问题是因为在服务休息中您可以允许制作CORS，因此您必须在服务器端更改或添加一些配置，或者更简单的方法是将html代码放在相同的url中是你的服务器，localhost:8080（你的 html 代码在 localhost:63342）

在您的服务器端，您必须添加“Access-Control-Allow-Origin=*”或类似的东西

【讨论】：

response.setHeader("Access-Control-Allow-Origin", "*"); response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");请提出其他建议。
但是您在回复中看到了这个？用firefox或chrome的调试控制台查看
查看这个开源实现：github.com/ebay/cors-filter（apache 许可）特别是看看高级配置示例。对我来说，这是一个可靠的解决方案，因为我最近遇到了同样的问题。在某些情况下，一个简单的过滤器实现似乎不起作用，尤其是在处理预检请求时。可以在此处找到关于 CORS 的非常好的文档developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS