Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.78/18: Рейтинг темы: голосов - 18, средняя оценка - 4.78
2 / 2 / 0
Регистрация: 11.04.2014
Сообщений: 115

Как записать ответ XMLHttpRequest в переменную?

04.07.2021, 15:58. Показов 3472. Ответов 3

Студворк — интернет-сервис помощи студентам
Добрый день. Ранее выполняла Ajax-запросы на jQuery, но поскольку теперь спрос на разработчиков, использующих данную библиотеку сокращается, изучаю JS.

В частности столкнулась с проблемой отправки Ajax-запроса, в jQuery таких проблем не было, здесь я уже десятки вариантов перепробовала. Да и на просторах других форумах не нашла ничего похожего.

Итак, я оправляю GET-запрос и мне его нужно записать в переменную. В одной из итераций я сделала callback-функцию, которая и обрабатывала полученные данные, но всё равно нужно, чтобы данные записывались в переменную.

Прочла про промисы, но скорее всего я не так поняла, поскольку у меня просто возвращается промис, а значение не получить. Если прописываю .then, то в консоль данные можно вывести, но в переменную не записать.

Код функции запроса:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
function request({method, date = '', body = '', callback, user_id = '', controller, action = ''}) {
    return new Promise(function(resolve, reject) {
        const  req = new XMLHttpRequest(),
            url = new URL('http://test.ru/app.php');
            url.searchParams.set('user_id', user_id);
            url.searchParams.set('date', date);
            url.searchParams.set('controller', controller);
            url.searchParams.set('action', action);         
        
        req.open(method, url);
        req.setRequestHeader('Content-Type', 'application/json');
 
        req.onload = function() {
            if (req.status == 200) {
                resolve(req.response);
            }
            else {
                reject(Error(req.statusText));
            }
        };
 
        req.onerror = function() {
            reject(Error("Network Error"));
        };
 
        req.send();   
        req.responseType = 'json';     
    });
}
Вызов:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
    let test = request(
        {
            'method': 'GET', 
            'date': date, 
            'user_id': '96856',
            'controller': 'test',
        }
    );
 
    test.then(function(value) {
        // запись в переменную не работает, только console.log(value)
    }, function(value) {
 
    });
Помогите, пожалуйста, кто знает, как правильно сделать. А то желание не использовать библиотеку jQuery постепенно пропадает.
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
04.07.2021, 15:58
Ответы с готовыми решениями:

ForceReplay как записать ответ пользователя в переменную?
Здравствуйте, заранее прошу прощения, если задал тупой вопрос или на него уже есть ответ на форуме. Собственно проблема: При нажатии...

XMLHttpRequest ждет ответ
Подскажите пожалуйста по такому вопросу. Делаю XMLHttpRequest запрос. Код примерно такой: //Делаем запрос к нейросети var...

XMLHttpRequest: не приходит ответ от сервера
Всем привет! В теле страницы имею это: <input type="text" id="name" name="login" onblur="checklogin()"...

3
Эксперт JS
 Аватар для Iverycool
1586 / 796 / 362
Регистрация: 01.02.2019
Сообщений: 1,047
04.07.2021, 20:02
Лучший ответ Сообщение было отмечено Настя223 как решение

Решение

Цитата Сообщение от Настя223 Посмотреть сообщение
запись в переменную не работает, только console.log(value)
Запись результата промиса в переменную просто вызвав его возможна только в async-функциях с ключевым словом await. В вашем коде в переменную test пишется промис как таковой. Может вам подойдёт такой вариант:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
async function main() {
  const test = await request({
    'method': 'GET', 
    'date': date, 
    'user_id': '96856',
    'controller': 'test',
  });
  console.log(test); // будет результат
}
 
// Не забудьте, что main надо вызвать
main();
Почитать:
https://learn.javascript.ru/promise-basics
https://learn.javascript.ru/async-await

Также стоит заметить, что можно использовать fetch вместо XHR - очень гибкий встроенный инструмент: https://learn.javascript.ru/fetch
3
2 / 2 / 0
Регистрация: 11.04.2014
Сообщений: 115
04.07.2021, 21:59  [ТС]
Iverycool, спасибо, так работает. Ещё нашла вариант, что можно отправлять запрос синхронно, тогда возможна запись в переменную, но вроде это плохо влияет на производительность.

Цитата Сообщение от Iverycool Посмотреть сообщение
Также стоит заметить, что можно использовать fetch вместо XHR - очень гибкий встроенный инструмент
С самого начала перехода на "чистый" JS пробовала fetch, он мне больше понравился, понятнее что ли. Но мне сказали не использовать его, так как он не очень хорошо поддерживается браузерами, особенно Safari. Так ли это я не знаю, скорее всего его буду использовать.
0
Эксперт JS
 Аватар для Iverycool
1586 / 796 / 362
Регистрация: 01.02.2019
Сообщений: 1,047
05.07.2021, 07:49
Настя223, синхронный xhr - крайне плохой вариант, так как он блокирует весь js, следовательно от страницы не получить какой-либо отклик, в некоторых браузерах даже прокручивать нельзя) А если такой запрос будет выполнятся долго, то браузер вообще предложит закрыть страницу. Такой запрос употребим лишь как замена sendBeacon, где его нет. Т.е. когда пользователь уже закрывает страницу, в событии unload для отправки статистики на сервер асинхронный xhr будет проигнорирован во многих браузерах, а синхронный сработает. Но и в этом случае есть свои минусы, поэтому в современном вэбе можно и "забыть" о XHR. (Для поддержки старых браузеров следует использовать полифиллы).
Цитата Сообщение от Настя223 Посмотреть сообщение
Но мне сказали не использовать его, так как он не очень хорошо поддерживается браузерами, особенно Safari.
Сейчас его базовые возможности (которые подходят для 98% случаев) поддерживают практически все браузеры, в том числе safari. В любом случае, существует уже немало хороших полифиллов.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
05.07.2021, 07:49
Помогаю со студенческими работами здесь

Не могу получить ответ XMLHttpRequest
Такая вот проблемка возникла - отправляю пост запрос на сервер и нужно получить ответ. Запрос отправляется верно, но xhr.onload не...

XmlHttpRequest запрос (отправка данных на label и ответ с сайта)
Имеется блокнот с неким словом на русском языке, к примеру, словом "мама". Нужно отправить это слово на сайт sozdik.kz(русско-казахский...

phpBB XmlHttpRequest запрос (отправка данных на label и ответ с сайта)
Имеется блокнот с неким словом на русском языке, к примеру, словом "мама". Нужно отправить это слово на сайт sozdik.kz(русско-казахский...

Как получить ответ Ajax в переменную
Доброго времени суток. Пытаюсь заставить нормально работать ajax. Есть контроллер который (пока что) выводит "hello ajax!". Делаю...

Записать день в переменную d,месяц в переменную m, год в переменную y
Как можно получить системную дату? Мне надо записать день в переменную d,месяц в переменную m, год в переменную y Заранее Спасибо!


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Уведомление о неверно выбранном значении справочника
Maks 06.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt
8Observer8 05.04.2026
Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .
AkelPad-скрипты, структуры, и немного лирики..
testuser2 05.04.2026
Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
Отображение реквизитов в документе по условию и контроль их заполнения
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II
kumehtar 04.04.2026
Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .
Вывод диалогового окна перед закрытием, если документ не проведён
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .
Программный контроль заполнения реквизитов табличной части документа
Maks 02.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .
wmic не является внутренней или внешней командой
Maks 02.04.2026
Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru