#javascript #cors
#javascript #корс #cors
Вопрос:
Я пытаюсь помочь другу с программой, но мой опыт кодирования несколько устарел (плюс-минус 10 лет). Где пытаются извлечь данные из базы данных через их API. Я делаю этот запрос через XMLHttpRequest, но у меня возникают проблемы даже с доступом к Серверу.
Ошибка, которая возникает:
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost/jasper/api.shiftbase.com/api/rosters?min_date=2020-07-13amp;max_date=2020-12-31amp;department_id=24477
Он пытается найти URL-адрес в моем собственном домене. Но мне это нужно для поиска в разных доменах.
Вся функция:
function getRequest(){
var _request = new XMLHttpRequest();
var key = myKeyHere;
var url = "api.shiftbase.com/api/rosters?min_date=2020-07-13amp;max_date=2020-12-31amp;department_id=24477";
_request.onreadystatechange = function(event){
console.log(_request.readyState " " _request.status);
if (_request.readyState == 4){
if ((_request.status >= 200 amp;amp; _request.status < 300) || _request.status == 304){
alert(_request.responseText);
} else {
alert('Request was unsucceful: ' _request.status);
}
}
};
_request.open("get", url, true);
_request.setRequestHeader("Accept", "application/JSON", false);
_request.setRequestHeader("Content-Type", "application/JSON", false);
_request.setRequestHeader("Authorization", key, false);
_request.send(null);
};
Я также много читал о CORS и о том, как это влияет на такого рода междоменные запросы, но я не совсем понимаю, как это работает и как я могу обойти это.
Любая помощь приветствуется.
Комментарии:
1. вашему URL-адресу нужен
https://
префикс2. Пробовал это и ранее (должен был сказать в моем первоначальном сообщении tbh), но затем я получаю ошибку HTTP_PROTOCOL_ERROR. Есть идеи, что это такое?
3. Вероятно, это связано с тем, что у вас в заголовках недопустимые символы.
application/JSON
должно бытьapplication/json
. И из того, что я смог найти с помощью быстрого поиска , следует, что ваш КЛЮЧ API должен быть в следующем форматеAPI [your key]
4. Tnx, похоже, проблема заключалась в JSON в capital / facepalm. Что касается ключа. Я использовал эту настройку, но на всякий случай не хотел размещать свой ключ в Интернете ^^. Высоко оцененный.
Ответ №1:
Прежде всего, вам нужно добавить в свой URL префикс https://
. Таким образом, вы отправляете запрос на внешний сервер вместо localhost. Во-вторых, в ваших заголовках application/JSON
должно быть application/json
.
Также не забывайте, что ваш ключ должен иметь префикс «API». Пример API [some_random_key]
Я протестировал следующий код, и он сработал. Вам просто нужно добавить свой собственный ключ API.
function getRequest(){
var _request = new XMLHttpRequest();
var key = "API [replace_this_with_your_key]"; // Example: "API a1b2c3d4e5f6g7h8i9"
var url = "https://api.shiftbase.com/api/rosters?min_date=2020-07-13amp;max_date=2020-12-31amp;department_id=24477";
_request.onreadystatechange = function(event){
console.log(_request.readyState " " _request.status);
if (_request.readyState == 4){
if ((_request.status >= 200 amp;amp; _request.status < 300) || _request.status == 304){
alert(_request.responseText);
} else {
alert('Request was unsucceful: ' _request.status);
}
}
};
_request.open("get", url, true);
_request.setRequestHeader("Accept", "application/json", false);
_request.setRequestHeader("Content-Type", "application/json", false);
_request.setRequestHeader("Authorization", key, false);
_request.send(null);
};
Ответ №2:
Попробуйте добавить //
в начале строки в url
объявлении переменной (строка 4), если вы хотите отправить запрос на внешний сервер.
Ваш запрос был отправлен на локальный веб-сервер http://localhost/jasper/...
, и вы получили ошибку 404 (не найдено).
Комментарии:
1. Попробовал ваше предложение, и, похоже, оно движется в правильном направлении. Теперь он выдает следующую ошибку: Доступ к XMLHttpRequest по адресу ‘ api.shiftbase.com/api /… ‘ из источника ‘ localhost ‘ заблокирован политикой CORS: Ответ на предполетный запрос не проходит проверку контроля доступа: перенаправление не разрешено для предполетного запроса. Итак, я, похоже, столкнулся с проблемой CORS, которую я описал ранее. есть идеи?