WordPress AJAX с использованием Axios

Question

WordPress AJAX с использованием Axios

7 окт. 2017 г., 13:30:05

Просмотры: 17.1K

Голосов: 10

У меня быстрый вопрос. Кто-нибудь смог использовать Axios внутри WordPress для выполнения AJAX запросов (wp_ajax с action - вызов функции) не через REST API, и как вы это сделали?

Похоже, что Axios отправляет JSON, и когда я пытаюсь сделать запрос, я получаю 0. Однако при использовании jQuery AJAX все работает нормально.

Ratko Solaja

131

ajax

Комментарии

что такое Axios? Мой любимый поисковик находит только компании с таким названием

mmm

7 окт. 2017 г. 14:39:35

Вот ссылка.

Ratko Solaja

7 окт. 2017 г. 14:41:36

Я попробовал пример с "axios.get" и получил JSON-данные корректно. Отредактируй свой вопрос, чтобы показать код, который ты пробовал.

mmm

7 окт. 2017 г. 21:28:30

Все ответы на вопрос

Комментарии

Это надежный способ. Позволяет избежать использования дополнительной библиотеки или функций с ограниченной обратной совместимостью.

RMH

29 нояб. 2017 г. 08:32:51

почему это не принято? я расстроен. И вопрос получил всего один голос (причем мой)??? что творится на stackoverflow????

Toskan

13 дек. 2018 г. 22:33:04

Это прекрасно сработало для меня!! Я постоянно получал 0 при использовании axios.post... а с этим решением проблема была исправлена. Вы знаете, почему это работает, помимо вашего волшебного кода?

Fernando Torres

30 июн. 2021 г. 23:36:08

Комментарии

ты сделал мой день, спасибо большое.

Fatih Toprak

21 дек. 2023 г. 00:02:19

Arturo Gallegos 432 · Answer 1 · 2017-10-30T18:26:42Z

вы можете использовать FormData

пример:

let form_data = new FormData;
form_data.append('action', 'myAction');
form_data.append('first_name', 'мое имя');
form_data.append('phone', 'мой телефон');

axios.post(myVars.ajax_url, form_data).then(function(response){
console.log(response.data);
})

Arturo Gallegos

432

30 окт. 2017 г. 18:26:42

Karthik Thayyil 199 · Answer 2 · 2017-10-11T10:44:56Z

Вам необходимо отправить данные в формате application/x-www-form-urlencoded.

Поскольку axios отправляет JSON, $_REQUEST['action'] не обрабатывается WordPress, и он возвращает '0'.

Для решения этой проблемы вы можете использовать либо URLSearchParams API, либо Qs.

Предположим, ваш код на jQuery выглядел так:


var data = { action: 'get_names', key2:'value2' ...... };

jQuery.post('/wp-admin/admin-ajax.php', data )
.done( function (response) {
    console.log(response);
})
.fail( function (error) {
    console.log(error);
});

Тогда соответствующий код на Axios с использованием URLSearchParams будет таким:


var params = new URLSearchParams();
params.append('action', 'get_names');
 params.append('key2', 'value2');
// params.append('key3', 'value3');
axios.post('/wp-admin/admin-ajax.php', params )
.then( function (response) {
    console.log(response.data);
})
.catch( function (error) {
    console.log(error);
});

ИЛИ если вы используете Qs.js, вам необходимо подключить Qs перед вашим скриптом:


var data = { action: 'get_names', key2:'value2' ...... }; 

axios.post('/wp-admin/admin-ajax.php', Qs.stringify( data ))
.then( function (response) {
    console.log(data);
})
.catch(function (error) {
    console.log(error);
});

Более подробно это объясняется по следующей ссылке.

https://kt12.in/blog/wordpress-ajax-call-using-axios-js/