ajax Возвращаемое значение функции не определено / [объект объекта] для jquery v3.41 + - PullRequest
0 голосов
/ 06 апреля 2020

В моем исследовании мне не удалось найти примеры функции ajax, которая не включает устаревшую функциональность jquery. Мне нужно решение v3.4.1 / 2020.


Проблема:

Я могу заставить функцию правильно выводить данные в console.log() до return. Я ожидаю, что console.log() отобразит возвращенные данные.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

function getData (url, privateToken) {
    $.ajax({
        'crossDomain': true,
        'url': url,
        'method': 'GET',
        'headers': {
            'PRIVATE-TOKEN': privateToken
        }
    })
    .done(function (response) {

        console.log(response[0].id);  // works correctly

        // ===================================

        var test = response[0].id;    
        console.log(test);            // works correctly

        // ===================================

        return response;              // does not work, `[object object]`` when function is called

        // ===================================

        return response[0].id;        // does not work, `undefined` when function is called

        // ===================================

        var test = response[0].id;    
        return test;                  // does not work, `undefined` when function is called

        // ===================================

        var test = response;    
        return test;                  // does not work, `[object object]` when function is called

        // ===================================

        return $(response).id;        // does not work, `undefined` when function is called
    });
}

$(document).ready(function(){
    console.log(getData("https://example.com/rest/api/xyz", "<private token>"));
});

Обратите внимание, что я знаю, что код остановится на первом return. Я просто хотел показать то, что пытались, легко усваиваемым образом.

1 Ответ

5 голосов
/ 23 апреля 2020

Как указано в комментариях, речь идет не столько о современном коде или соглашениях jQuery, сколько о неправильном понимании возврата данных из асинхронных вызовов jQuery. Новый или старый код, вы не можете вернуть ответ от done() или always() обратного вызова.

Сами документы jQuery включают простой пример - в разделе Объект jqXHR , прокрутите вниз под желтым Уведомление об устаревании .

Вот рабочий JSFiddle с модифицированной версией вашего кода, используя подход, описанный в jQuery документы. Посмотрев его с открытой консолью, я добавил серию console.log() s, чтобы показать последовательность запуска и продемонстрировать получение и использование ответа, как и ожидалось. Обратите внимание, что JSFiddle включает способ имитации асинхронных c запросов, сделав их /echo/json, и я обновил код, чтобы использовать его, чтобы мы могли видеть, как он работает.

function getData (url, privateToken) {
    // return the jqXHR object, which is not your response!
    return $.ajax({
        'url': url,
        // ... etc
    }).done(function (response) {
        // you can log response here, display alerts, manipulate DOM, etc,
        // but not return anything useful
    });
}

$(document).ready(function(){
    var $ajax = getData("/echo/json/", "token");
    // Execution will continue here long before getData has completed
    $ajax.always(function(response, textStatus, jqXHR) {
        // Now getData has finished, and we have the response!
        console.dir(response);
    });
});
...