Чтение Ответа JSON с Javascript - Проблема

Question

Я отправляю данные на сервер с помощью JSON и метода post, но не могу прочитать ответ с сервера.Вот мой код:

var xhr = new XMLHttpRequest();
xhr.open("POST", "https://staging.smartenupcs.com/api/v1/licenses/create", true);
xhr.setRequestHeader("Smartenup-API-KEY", "webflow.c407d56c5ab23115af0075+DzDMrMtWZENCoct9Pa7DUA54mIgP8c9o");
var jsonStr = JSON.stringify({
  "first_name": "Bla",
  "last_name": "Blabla",
  "email": "bla@gmail.com",
  "product_name": "webflow_essentials",
  "order_id": 21811,
  "voucher": null

});
xhr.send(jsonStr);

xhr.onreadystatechange = function() {
  if (xhr.readyState == 4 && xhr.status == 200) {
    var myObj = JSON.parse(xhr.responseText);
    alert(myObj);
  }
};

Я перепробовал много вариантов, но безуспешно.

Я надеюсь, что кто-то может помочь, заранее спасибо

Answer 1

Нет проблем с кодом.

Проблема связана с запросами перекрестного происхождения.Похоже, вы используете API, отличный от staging.smartenupcs.com, скорее всего, localhost.

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

PS: он будет работать без перекрестных заголовков, если ваш код интерфейса и API размещены в одном домене.

Answer 2

Я бы рекомендовал использовать API извлечения вместо объекта XMLHttpRequest.

function postData(url = `UR_URL_HERE`, data = {}) {
  // Default options are marked with *
    return fetch(url, {
        method: "POST", // *GET, POST, PUT, DELETE, etc.
        mode: "cors", // no-cors, cors, *same-origin
        cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
        credentials: "same-origin", // include, *same-origin, omit
        headers: {
            "Content-Type": "application/json",
            // "Content-Type": "application/x-www-form-urlencoded",
        },
        redirect: "follow", // manual, *follow, error
        referrer: "no-referrer", // no-referrer, *client
        body: JSON.stringify(data), // body data type must match "Content-Type" header
    })
    .then(response => response.json()); // parses response to JSON
}

Answer 3

Пожалуйста, проверьте на стороне сервера заголовок Access-Control-Allow-Origin.Также проверьте предварительный запрос OPTIONS этого API / действия.После этого проверьте состояние ответа API и условие проверки вашего ответа.