AngularJS: запрос на перекрестный запрос заблокирован: политика одинакового происхождения запрещает чтение удаленного ресурса

вот мой код:

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 все еще не работает!

Я надеюсь, что кто-то может дать какую-либо идею.

Ответ 1

Добавьте эти заголовки со стороны сервера:

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

Если все еще не работает, отправьте информацию о запросе предпросмотра OPTIONS, который отправляет браузер.

Зачем это требуется?

Если это не простой запрос (например, GET или POST данных формы), браузер отправляет серверу запрос preflight 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.

Я надеюсь, что это поможет другим.

Ответ 2

Добавьте заголовок в свой файл, который вы нажимаете на вызов ajax следующим образом

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

Ответ 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();
}

Ответ 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);
        }        
    }

Кстати, вы можете копать глубже через post angularjs spring заблокирован запрос перекрестного происхождения