Utilizarea Axios în WordPress pentru cereri AJAX

Question

Utilizarea Axios în WordPress pentru cereri AJAX

7 oct. 2017, 13:30:05

Vizualizări: 17.1K

Voturi: 10

Am o întrebare rapidă. A reușit cineva să folosească Axios în WordPress pentru a face cereri AJAX (wp_ajax cu action - apelând o funcție) nu prin REST API și cum ați făcut acest lucru?

Se pare că Axios trimite un JSON și ori de câte ori încerc cererea primesc un 0 ca răspuns. Totuși, folosind jQuery AJAX funcționează fără probleme.

Ratko Solaja

131

ajax

Comentarii

ce este Axios? motorul meu de căutare preferat găsește doar companii cu acest nume

mmm

7 oct. 2017 14:39:35

Iată un link.

Ratko Solaja

7 oct. 2017 14:41:36

Am încercat un exemplu cu "axios.get" și am primit corect datele JSON. Editează întrebarea ta pentru a arăta codul pe care l-ai încercat.

mmm

7 oct. 2017 21:28:30

Toate răspunsurile la întrebare

Comentarii

Acesta este un mod solid. Evită utilizarea unei alte biblioteci sau a unei funcții care are compatibilitate limitată cu versiunile anterioare.

RMH

29 nov. 2017 08:32:51

de ce nu este acceptat acest răspuns? sunt supărat. Și întrebarea a primit doar un vot în sus (și acela de la mine)??? ce se întâmplă pe stackoverflow????

Toskan

13 dec. 2018 22:33:04

A funcționat excelent pentru mine!! Primeam întotdeauna 0 folosind axios.post... iar cu această soluție problema a fost rezolvată. Știi de ce funcționează codul tău magic?

Fernando Torres

30 iun. 2021 23:36:08

Comentarii

mi-ai făcut ziua, mulțumesc mult.

Fatih Toprak

21 dec. 2023 00:02:19

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

poți folosi FormData

un exemplu:

let form_data = new FormData;
form_data.append('action', 'myAction');
form_data.append('first_name', 'my first name');
form_data.append('phone', 'my phone');

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

Arturo Gallegos

432

30 oct. 2017 18:26:42

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

Trebuie să trimiteți datele în formatul application/x-www-form-urlencoded.

Deoarece axios trimite json, $_REQUEST['action'] nu este primit de WordPress și acesta returnează '0'.

Pentru a realiza acest lucru, puteți utiliza fie API-ul URLSearchParams, fie Qs.

Acum să presupunem că jQuery-ul vostru arăta astfel


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);
});

Atunci, folosind URLSearchParams, codul corespunzător în Axios va fi


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);
});

SAU dacă utilizați Qs.js, trebuie să încărcați Qs înaintea scriptului vostru


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);
});

Acest lucru este explicat mai detaliat în următorul link.

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