Вопрос о создании XHR-запросов

Question

Я не уверен, почему, но я действительно не смог найти подходящий ресурс для этого, который помогает мне понять лучшую практику здесь, но, скажем, у меня есть приложение, которое я хочу сделать Ajax-запрос другомуapplication.

Скажите, что доменное имя приложения A: www.example.com, и я хочу сделать запрос к www.someapplication.com

Могу ли я сделать что-то подобное?(в данном случае jQuery)

$.ajax({
  url: 'http://www.someapplication.com/items',
  dataType: 'json',
  data: "search=butter",
  success: function(data){
    console.log(data);
  }
});

Когда я беру адрес (http://www.someapplication.com/items?search=butter&format=json) в моем браузере, он возвращает ответ 200 и контент в формате json, который я запросил однако когда вышеуказанный JS выполняет, он получает ответ 200, но нет содержимого.

Это потому, что мой сервер на someapplication.com распознает это как атаку XSS и отрицает ответ?

Один из них, который у меня был, должен ли запрос идти в файл .js?Я заметил это в дизайне других приложений, например: http://www.someapplication.com/search.js ... скорее, что не так с моими концепциями, я что-то упускаю из-за XSS и Ajax?

Answer 1

Это действительно из-за той же политики происхождения. Если у вас есть контроль над удаленным сервером, вы также можете просто добавить заголовки HTTP Access-Control на стороне сервера. Таким образом, вы в основном управляете со стороны сервера тем, разрешено ли клиенту, который запустил XMLHttpRequest, обработать ответ. Любой недавний (и достойный) веб-браузер примет соответствующие меры.

Вот пример, нацеленный на PHP, как правильно установить заголовки.

header('Access-Control-Allow-Origin: *'); // Everone may process the response.
header('Access-Control-Max-Age: 604800'); // Client may cache this for one week.
header('Access-Control-Allow-Methods: GET, POST'); // Allowed request methods.

Ключ Access-Control-Allow-Origin: *. Это информирует клиента о том, что запросы, исходящие из * (фактически, везде), могут обрабатывать ответ. Если вы установите его, например, Access-Control-Allow-Origin: http://example.com, тогда веб-браузер сможет обрабатывать ответ только тогда, когда начальная страница будет обслуживаться из указанного домена.

Многие существующие сервисы JSON также используют это, под каждым из них Google.

Смотри также:

• MDC - контроль доступа HTTP

Answer 2

Хотя междоменный XHR доступен не во всех браузерах, вы можете создать шлюз из простого PHP-файла:

<?php
echo file_get_contents($_GET['url']);
?>

Тогда вы просто используете правильный URL: gateway.php?url=http://www.someapplication.com/items.Возможно, это не идеальное решение, но оно работает.

РЕДАКТИРОВАТЬ: рассмотрите возможность объявления URL-адресов файлов PHP (или просто доменов), которые вы хотите использовать, чтобы избежать возможного злоупотребления шлюзом, например:

<?php
$urls = array();
$urls[0] = 'http://www.someapplication.com/items';
echo file_get_contents($urls[$_GET['id']]);
?>

Answer 3

В ответе Ника вы заполняете информацию о том, как использовать JSONP.Я хочу добавить вам рекомендацию, как изменить ваш код $ .ajax, чтобы увидеть, что у вас ошибка внутри обработчика success.Я описал это в jQuery $ .ajax, обработчик ошибок не работает .Возможно, ошибка в jQuery после изменения http://dev.jquery.com/changeset/6432 будет исправлена ​​в ближайшее время.До тех пор, пока вы не сможете использовать

success: function(data, textStatus, xhr){
    if (xhr.readyState === 4 && xhr.status === 0) {
        alert('"error flag\" is true. It means that we have a network error '+
              'or abortion (for example because of Same Origin Policy restrictions)');
    }
},
error: function(xhr, textStatus, errorThrown) {
    if (textStatus !== null) {
        alert("error: " + textStatus);
    } else if (errorThrown !== null) {
        alert("exception: " + errorThrown.message);
    } else {
        alert ("error");
    }
}

В этом случае вы увидите ошибку "exception: access denied" в IE и

"error flag" is true. It means that we have a network error or abortion
 (for example because of Same Origin Policy restrictions)

в других веб-браузерах в случае ошибки той же политики происхождения.

Кстати, в моих экспериментах браузер возвращает xhr.status = 0, а не 200 в случае ошибки политики того же происхождения.

Answer 4

То, что вы нажимаете, это та же политика происхождения , удаленный домен должен поддерживать JSONP , чтобы работать, в противном случае XmlHttpRequest запрещается (браузером) видя содержание.

После настройки в jQuery вы будете запускать поведение JSONP, задав вместо dataType значение jsonp, например:

$.ajax({
  url: 'http://www.someapplication.com/items',
  dataType: 'jsonp',
  data: "search=butter",
  success: function(data){
    console.log(data);
  }
});

Это запрашивает содержимое полностью другим способом, добавляя элемент <script> на страницу ... поэтому домен должен поддерживать JSONP, в противном случае вы увидите некоторую разновидность синтаксической ошибки, когда ответ возвращается.