CORS - Как выполнить предварительную проверку httprequest?

Question

Я пытаюсь сделать междоменный HTTP-запрос к службе WCF (которой я владею). Я прочитал несколько методов для работы с междоменными ограничениями сценариев. Поскольку моя служба должна обрабатывать запросы как GET, так и POST, я не могу реализовать динамический тег сценария, src которого является URL-адресом запроса GET. Поскольку я свободен вносить изменения на сервере, я начал пытаться реализовать обходной путь, который включает в себя настройку ответов сервера для включения заголовка «Access-Control-Allow-Origin» и запросов «preflight» с запросом OPTIONS. Я получил идею из этого поста: Как работает CORS

На стороне сервера мой веб-метод добавляет «Access-Control-Allow-Origin: *» к ответу HTTP. Я вижу, что ответы теперь включают этот заголовок. У меня вопрос: как мне «предварительно выполнить» запрос (ОПЦИИ)? Я использую jQuery.getJSON, чтобы сделать запрос GET, но браузер сразу же отменяет запрос с печально известной:

Источник http://localhost не разрешен Access-Control-Allow-Origin

Кто-нибудь знаком с этой техникой CORS? Какие изменения необходимо внести на клиенте, чтобы выполнить предварительную проверку моего запроса?

Спасибо!

Answer 1

Во время предварительного запроса вы должны увидеть следующие два заголовка: Access-Control-Request-Method и Access-Control-Request-Headers.Эти заголовки запроса запрашивают у сервера разрешения на выполнение фактического запроса.Ваш предполётный ответ должен подтвердить эти заголовки, чтобы действительный запрос работал.

Например, предположим, что браузер отправляет запрос со следующими заголовками:

Origin: http://yourdomain.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-Custom-Header

Ваш сервер должен затемответьте следующими заголовками:

Access-Control-Allow-Origin: http://yourdomain.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: X-Custom-Header

Обратите особое внимание на заголовок ответа Access-Control-Allow-Headers.Значение этого заголовка должно быть такими же заголовками в заголовке запроса Access-Control-Request-Headers, и это не может быть '*'.

Как только вы отправите этот ответ на предварительный запрос, браузер выполнит фактический запрос.Вы можете узнать больше о CORS здесь: http://www.html5rocks.com/en/tutorials/cors/

Answer 2

Хотя эта тема датируется 2014 годом, эта проблема все еще может быть актуальна для многих из нас. Вот как я справился с этим в контексте jQuery 1.12 / PHP 5.6:

• jQuery отправил свой запрос XHR, используя только ограниченные заголовки; только «Происхождение» было отправлено.
• Предварительный запрос не требовался.
• Сервер должен был только обнаружить такой запрос и добавить «Access-Control-Allow-Origin:». Заголовок $ _SERVER ['HTTP_ORIGIN'], после обнаружения, что это XHR перекрестного происхождения.

Пример кода PHP:

if (!empty($_SERVER['HTTP_ORIGIN'])) {
    // Uh oh, this XHR comes from outer space...
    // Use this opportunity to filter out referers that shouldn't be allowed to see this request
    if (!preg_match('@\.partner\.domain\.net$@'))
        die("End of the road if you're not my business partner.");

    // otherwise oblige
    header("Access-Control-Allow-Origin: " . $_SERVER['HTTP_ORIGIN']);
}
else {
    // local request, no need to send a specific header for CORS
}

В частности, не добавляйте exit;, так как предварительная проверка не требуется.