XMLHttpRequest cannot load. No 'Access-Control-Allow-Origin' header is present on the requested resource
1,00
р.
Добрый день. Есть задача: используя REST API сервиса доставки, описанный здесь, осуществить запрос стоимости доставки. Для этого нужно открыть сессию(Login), выполнить запрос, а после закрыть(Logout). Не получается открыть сессию.
Написал js-код для осуществления кросс-доменного запроса и возврата результата.
$(document).ready(function () { $.ajax({ type: 'POST', url: 'http://e-solution.pickpoint.ru/apitest/login', crossDomain: true, contentType: 'application/json', dataType: 'json', data: { Login: 'apitest', Password: 'apitest' }, xhrFields: { withCredentials: false }, success: function (status) { console.log(status) }, error: function (xhr, status) { console.log(xhr) console.log(status) } }) })
Получаю ошибку в консоли:
XMLHttpRequest cannot load http://e-solution.pickpoint.ru/apitest/login. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<Адрес моего сайта>' is therefore not allowed access.
Вывод:
Object {readyState: 0, responseJSON: undefined, status: 0, statusText: "error"}
На основе гугления добавил соответствующие заголовки. Фрагмент файла .htaccess:
Header add X-Content-Type-Options nosniff Header add Access-Control-Allow-Origin: * Header add Access-Control-Allow-Credentials: true Header add Access-Control-Allow-Headers: "origin, x-requested-with, content-type" Header add Access-Control-Allow-Methods: "PUT, GET, POST, DELETE, OPTIONS"
Так же добавил в начало файла строку:
header("Access-Control-Allow-Origin: *")
Но по-прежнему не получается осуществить запрос. Что делать?
Ответ
Политика безопасности браузеров запрещает выполнение кроссдоменных AJAX запросов. Чтобы это обойти, как было замечено выше нужно добавить заголовок Access-Control-Allow-Origin, но возвращать его должен домен к которому вы обращаетесь. Я так понимаю доступа для изменения настроек у вас к нему нет.
Обходится это следующим образом, вы делаете запрос к серверному скрипту, расположенному на вашем сайте, который перенаправляет запрос на нужный сайт.
Написал js-код для осуществления кросс-доменного запроса и возврата результата.
$(document).ready(function () { $.ajax({ type: 'POST', url: 'http://e-solution.pickpoint.ru/apitest/login', crossDomain: true, contentType: 'application/json', dataType: 'json', data: { Login: 'apitest', Password: 'apitest' }, xhrFields: { withCredentials: false }, success: function (status) { console.log(status) }, error: function (xhr, status) { console.log(xhr) console.log(status) } }) })
Получаю ошибку в консоли:
XMLHttpRequest cannot load http://e-solution.pickpoint.ru/apitest/login. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<Адрес моего сайта>' is therefore not allowed access.
Вывод:
Object {readyState: 0, responseJSON: undefined, status: 0, statusText: "error"}
На основе гугления добавил соответствующие заголовки. Фрагмент файла .htaccess:
Header add X-Content-Type-Options nosniff Header add Access-Control-Allow-Origin: * Header add Access-Control-Allow-Credentials: true Header add Access-Control-Allow-Headers: "origin, x-requested-with, content-type" Header add Access-Control-Allow-Methods: "PUT, GET, POST, DELETE, OPTIONS"
Так же добавил в начало файла строку:
header("Access-Control-Allow-Origin: *")
Но по-прежнему не получается осуществить запрос. Что делать?
Ответ
Политика безопасности браузеров запрещает выполнение кроссдоменных AJAX запросов. Чтобы это обойти, как было замечено выше нужно добавить заголовок Access-Control-Allow-Origin, но возвращать его должен домен к которому вы обращаетесь. Я так понимаю доступа для изменения настроек у вас к нему нет.
Обходится это следующим образом, вы делаете запрос к серверному скрипту, расположенному на вашем сайте, который перенаправляет запрос на нужный сайт.
