JQuery $.ajax выполняется как локальный HTML файл, избегая SOP (такая же политика происхождения)

Я создал файл HTML foo.html со следующим содержимым:

  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script> 
      $.ajax({url:"http://foo.com/mdata",
        error: function (results) {
          alert("fail");
        },
        success: function (result) {
          alert("sucesses");
        }
      });
    </script>

Когда я загружаю этот HTML файл в веб-браузер, он всегда показывает диалоговое окно с ошибкой.

  • Любая идея, почему это происходит?
  • И что является лучшим способом отладить это?

PS:

Предположим, что http://foo.com/mdata - допустимый путь веб-службы.

ИЗМЕНИТЬ № 1

Решение

аналогичный код отлично работал со мной, используя $.getJson http://jsfiddle.net/dpant/EK3W8/

Я также сохранил содержимое как .html файл и запрос из файла://к веб-службе также работает.

<!DOCTYPE html>
<html>
<head>
  <style>img{ height: 100px; float: left; }</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <div id="images">

</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
  {
    tags: "mount rainier",
    tagmode: "any",
    format: "json"
  },
  function(data) {
    $.each(data.items, function(i,item){
      $("<img/>").attr("src", item.media.m).appendTo("#images");
      if ( i == 3 ) return false;
    });
  });</script>

</body>
</html>

Похоже, что большинство браузеров поддерживает CROS, поэтому вы можете написать script сохранить его как .html и открыть его в браузере, и он будет успешно выполнять запрос Ajax * при условии, что сервер, который вы запрашиваете, поддерживает его *, В этом случае мой веб-сервер (служба) не поддерживает CROS (и конфигурация по умолчанию Apache не поддерживает его).

Многие из веб-служб включили CROS, например http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=? поэтому запрос проходит успешно.

Несколько ссылок:

http://enable-cors.org/

https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing

Ответ 1

Он всегда терпит неудачу по двум причинам:

  • Вам нужен веб-сервер, который отвечает на ваш запрос (200 = успех, 404, т.е. ошибка) на Linux вы можете легко настроить его, на Windows и Mac посмотреть на Bitnami
  • Вы не можете позвонить в другой домен через AJAX. Если вы используете script на www.example.com, вы не можете запрашивать www.example.net Посмотрите на ту же самую политику происхождения.

Ответ 2

На самом деле мы trting для отправки запроса AJAX пересекаем домены, чтобы это произошло. Я пробовал этот код. на моей машине это показывает успех.

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script> 
    $.support.cors = true;
      $.ajax({url:"http://www.google.co.in/",
        error: function (xhr, ajaxOptions, thrownError) {

            alert("fail");
            alert(xhr.status);
            alert(thrownError);
       },
        success:function(result){
              alert("sucesses");
        }
      });

    </script>

Код работает отлично с добавлением строки $.support.cors=true, это определенно сработает для вас.

Ответ 3

Как я понял, в Content Scripts вы не можете выполнять Cross-Domain XHR. Вам нужно будет сделать их на дополнительной странице, например Background, Popup или даже Options, чтобы сделать это.

Дополнительную информацию о содержании script можно найти на странице Скрипты содержимого в Руководстве разработчика Google.

И для получения дополнительной информации о ограничении xhr см. страницу XHR.