Смертельные CORS когда http://localhost является ли происхождение

Я застрял с этой проблемой CORS, хотя я установил сервер (nginx/node.JS) с соответствующими заголовками.

Я вижу в Chrome Network pane - > заголовки ответов:

Access-Control-Allow-Origin:http://localhost

- это должно помочь.

вот код, который я использую для проверки:

var xhr = new XMLHttpRequest();
xhr.onload = function() {
   console.log('xhr loaded');
};
xhr.open('GET', 'http://stackoverflow.com/');
xhr.send();

Я

XMLHttpRequest cannot load http://stackoverflow.com/. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

Я подозреваю, что проблема в клиентском скрипте, а не в конфигурации сервера...

3 ответов


Chrome не поддерживает localhost для запросов CORS (открытая ошибка с 2010 года).

чтобы обойти это, вы можете использовать домен как lvh.me (который указывает на 127.0.0.1 так же, как localhost) или запустите chrome с помощью --disable-web-security флаг (предполагая, что вы только тестирование).


реальная проблема заключается в том, что если мы установим-Allow - for all request (OPTIONS & POST), Chrome отменит его. Следующий код работает для меня с POST to LocalHost с Chrome

<?php
if (isset($_SERVER['HTTP_ORIGIN'])) {
    //header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
    header("Access-Control-Allow-Origin: *");
    header('Access-Control-Allow-Credentials: true');    
    header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); 
}   
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
        header("Access-Control-Allow-Methods: GET, POST, OPTIONS");         
    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
        header("Access-Control-Allow-Headers:{$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");

    exit(0);
} 
?>

за ответ @Beau, Chrome не поддерживает запросы localhost CORS, и вряд ли какие-либо изменения в этом направлении.

Я использую Allow-Control-Allow-Origin: * Расширение Chrome обойти этот вопрос. Расширение добавит необходимые HTTP-заголовки для CORS:

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: "GET, PUT, POST, DELETE, HEAD, OPTIONS"
Access-Control-Expose-Headers: <you can add values here>

на исходный код опубликован на GitHub.

обратите внимание, что расширение фильтрует все URL-адреса по умолчанию. Это может нарушить некоторые веб-сайты (для например, в Dropbox). Я изменил его на filter only localhost в URL-адреса со следующим URL-фильтром

*://localhost:*/*