Ajax - не конвертирует в объект json с сервера

245
24 декабря 2017, 10:51

Вечер добрый. Есть кнопка в хтмл при клике на нее срабатывает этот скрипт:

var btn = document.getElementById('btn');
var request = new XMLHttpRequest();
btn.addEventListener('click', function () {
var optionsGetFile = {
    request: request,
    method: 'GET',
    url: '/test.json',
    async: true,
    data: null,
    headers: 'application/json',
    success: function () {
        var optionsSendFile = {
            request: request,
            method: 'POST',
            url: '/form.php',
            async: true,
            data: JSON.stringify(request.responseText),
            headers: 'application/json',
            success: function () {
                var res = JSON.parse(request.responseText);
                console.log(res.logins);
            },
            error: function () {
                alert(request.statusText + ': error');
            }
        };
        ajax(optionsSendFile);
    },
    error: function () {
        alert(request.statusText + ': error. Ошибка в передачи файла!');
    }
};
ajax(optionsGetFile);
});
function ajax(options) {
options.request.open(options.method, options.url, options.async);
options.request.setRequestHeader('Content-type', options.headers);
options.request.send(options.data);
options.request.onreadystatechange = function () {
    if (options.request.readyState === 4) {
        if (options.request.status === 200) {
            options.success()
        } else {
            options.error();
        }
    }
  };
}

Собственно form.php выглядит следующим образом:

<?php
if(file_get_contents('php://input')) {
    $data = json_decode(file_get_contents('php://input'));
    echo json_encode($data);
}

Файл test.json:

{
  "logins": [
    "valkiria111",
    "max666",
    "alesana1993"
  ]
}

Вопрос вот в чем. Как мне здесь:

var res = JSON.parse(request.responseText);
console.log(res.logins);

Получить объект. console log выводит undefined. Вопрос почему? Т.е он не преобразует json в объект. В итоге json так и остается строкой.

Answer 1

Проблема в том, что json - это текстовый формат обмена данными. По сути, когда вы считываете файл - уже прилетает именно строка. А вы её вдобавок обрабатываете

JSON.stringify(request.responseText)

Получается строка в строке. stringify нужно применять к объекту...

В результате с сервера прилетает точно такой же ответ. Грубо говоря:

""{\"logins\":[\"valkiria111\",\"max666\",\"alesana1993\"]}""

Тогда либо нужно два раза парсить ответ:

var res = JSON.parse(request.responseText);
console.log(JSON.parse(res));

Что конечно не то....

Либо просто отправлять строку без всяких stringify

data: request.responseText,
READ ALSO
Реализация spinner-loader AngularJS

Реализация spinner-loader AngularJS

привет хочу реализовать loader делаю так контроллер

401
Допустима ли такая запись?

Допустима ли такая запись?

Допустима ли такая запись?

228