Ajax Jquery CORS не работает

#javascript #jquery #ajax #cors

#javascript #jquery #ajax #cors

Вопрос:

Всем привет, я борюсь и ищу решения по этому поводу уже 3 дня. У меня проблема с получением данных из sharethis.com RestAPI. Я работаю с jQuery и Laravel 5.2. Я хочу получить значения из этого json:http://rest.sharethis.com/v1/count/urlinfo?url=http://www.sharethis.com но я очень разочарован, перепробовав множество методов и функций. Мой фактический код таков:

 function setHeader(xhr) {
xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
xhr.setRequestHeader('Access-Control-Allow-Headers', 'Content-Type');
xhr.setRequestHeader("Access-Control-Allow-Methods", "GET,POST,PUT,DELETE,OPTIONS");
}
$.ajax({
url: 'http://rest.sharethis.com/v1/count/urlinfo?url=http://www.sharethis.com',
type: 'GET',
beforeSend: setHeader,
contentType: 'application/json; charset=utf-8',
success: function() { alert("Success"); },
error: function() { alert('Failed!'); }
});
  

Этот запрос всегда возвращает «Сбой!». Я немного понимаю, что означает CORS, но на практике я не могу заставить это работать. Есть идеи? Спасибо..

Комментарии:

1. «Я понимаю CORS» … очевидно, что вы этого не делаете, эти заголовки не могут быть установлены в запросе, они должны быть установлены на стороне сервера

2. Привет @ charlietfl я поместил это в первую строку моего php-файла: <?php header(‘Access-Control-Allow-Origin: *’); ?> но не внес никаких изменений… есть идеи?

3. @Francisco Одного этого заголовка недостаточно. Вам также нужны Allow-Headers и Allow-Methods .

4. Но вы не контролируете sharethis.com . Запрос не отправляется на ваш сервер.

Ответ №1:

Возможно, вы на самом деле не понимаете CORS 🙂

Эти заголовки должны присутствовать в ответе, а не в запросе.

Сервер должен их предоставить.

Сервер должен согласиться.

Указанный вами URL-адрес не имеет заголовков CORS, поэтому вы не сможете получить его через AJAX, если не измените серверную часть.

Ответ №2:

Запустите этот код с помощью XMLHttpRequest, чтобы получить данные

  var url = "http://rest.sharethis.com/v1/count/urlinfo?url=http://www.sharethis.com";

 var xhr = createCORSRequest('GET', url);

 xhr.setRequestHeader(

'X-Custom-Header', 'value');

xhr.withCredentials = true;

xhr.onload = function () {

            if (this.status === 200) {

                console.log(xhr);
            }

};

xhr.send();
  

И есть функция для проверки, поддерживает ли URL CORS

 function createCORSRequest(method, url) 
{

var xhr = new XMLHttpRequest();

 if ("withCredentials" in xhr) {
   // XHR for Chrome/Firefox/Opera/Safari.
   xhr.open(method, url, true);

   console.log("for chrome/fir");
 } else if (typeof XDomainRequest != "undefined") {
   // XDomainRequest for IE.
   xhr = new XDomainRequest();
   xhr.open(method, url);

   console.log("ie");
 } else {
   // CORS not supported.
   xhr = null;
   console.log("not supported");
 }
 return xhr;
}   
  

надеюсь, это поможет, с уважением

Комментарии:

1. Привет, спасибо за помощь, но консоль по-прежнему выдает: XMLHttpRequest не может загрузиться rest.sharethis.com/v1/count/urlinfo?url=http ://… . Ответ на предполетный запрос не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок ‘Access-Control-Allow-Origin’. Следовательно, доступ к исходному ‘ localhost ‘ запрещен.