Question

这是我的代码：

angular.module('option')
    .factory('optionListService', ['$resource', function($resource) {
    return $resource(HOST+'option/action/:id', {}, {
        'get':    {method:'GET'},
            'save':   {method:'POST'},
            'query':  {method:'GET', isArray:true},
            'remove': {method:'DELETE'},
            'delete': {method:'DELETE'}
    });
    }]);

这适用于GET请求，而不适用于POST！

我使用Apache作为服务器并使用以下命令进行配置：

<Limit GET HEAD POST PUT DELETE OPTIONS>
        Order Allow,Deny
        Allow from all
    </Limit>
Header set Access-Control-Allow-Origin "*"

在我的angularjs中，我包含在模块app的配置中：

delete $httpProvider.defaults.headers.common['X-Requested-With'];
delete $httpProvider.defaults.headers.post['Content-type'];

但请求POST仍无法正常工作!!

我希望有人可以提出任何想法。

Answer 1

在服务器端添加这些标题：

Access-Control-Request-Headers: X-Requested-With, accept, content-type
Access-Control-Allow-Methods: GET, POST

如果仍然无法发布浏览器正在发送的预检OPTIONS请求的详细信息。

为什么需要这样做？

如果它不是简单的请求（例如表格数据的GET或POST），则浏览器向服务器发送预检HTTP OPTIONS请求以检查是否允许CORS。此请求包含一些Access-Control-Request标头（可能因具体请求而异）：

Access-Control-Request-Headers: accept, content-type
Access-Control-Request-Method: POST

现在服务器在响应中引用相同的Access-Control-Allow标头非常重要：

Access-Control-Allow-Headers: accept, content-type
Access-Control-Allow-Methods: POST
Access-Control-Allow-Origin: *

否则浏览器会拒绝该请求。

@ilyas：经过3个小时的研究后，我终于找到了这个问题

//Part added by ilyas :
    if (isset($_SERVER['HTTP_ORIGIN'])) {
        header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
        header('Access-Control-Allow-Credentials: true');
        header('Access-Control-Max-Age: 86400');    // cache for 1 day
    }
//End of part.

我希望这有助于他人。

Answer 2

将Header添加到您从ajax调用中访问的文件中，如下所示

<? php header('Access-Control-Allow-Origin: *'); ?>

Answer 3

我在http://www.codingpedia.org/ama/how-to-add-cors-support-on-the-server-side-in-java-with-jersey/

找到了很好的例子和解释

@GET
@Path("{id}")
@Produces({ MediaType.APPLICATION_JSON, MediaType.APPLICATION_XML })
public Response getPodcastById(@PathParam("id") Long id,     @QueryParam("detailed") boolean detailed)
        throws IOException, AppException {
    Podcast podcastById = podcastService.getPodcastById(id);
    return Response.ok() //200
            .entity(podcastById, detailed ? new Annotation[]        {PodcastDetailedView.Factory.get()} : new Annotation[0])
            .header("Access-Control-Allow-Origin", "*")
            .header("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT")    
            .allow("OPTIONS").build();
}

Answer 4

这是服务器端的问题。如果您的应用程序使用spring框架。您可以使用过滤方法

来修复它

@Override
    protected void doFilterInternal(HttpServletRequest req, HttpServletResponse res, FilterChain chain) throws ServletException, IOException {
        res.setHeader("Access-Control-Allow-Origin", "*");
        res.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
        res.setHeader("Access-Control-Max-Age", "3600");
        res.setHeader("Access-Control-Allow-Headers", "X-PINGOTHER,Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Authorization");
        res.addHeader("Access-Control-Expose-Headers", "xsrf-token");
        if ("OPTIONS".equals(req.getMethod())) {
         res.setStatus(HttpServletResponse.SC_OK);
        } else { 
         chain.doFilter(req, res);
        }        
    }

顺便说一句，您可以通过帖子angularjs spring cross-origin request blocked

深入挖掘

AngularJS：阻止跨源请求：同源策略禁止读取远程资源

4 个答案: