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

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中，我包含在模块应用程序的配置中：

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），浏览器将向OPTIONS服务器发送预检HTTP
请求，以检查是否允许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.

希望这对其他人有帮助。