Odesílání GET požadavků přes AJAX v JavaScriptu
Nyní se naučme předávat data na server v AJAX požadavku. Server s těmito daty něco provede a pošle nám zpět výsledek.
Náš testovací server bude zpracovávat
data odeslaná na adresu
/handler/:
button.addEventListener('click', function() {
let promise = fetch('/handler/');
});
Pro začátek pošleme GET požadavek:
button.addEventListener('click', function() {
let promise = fetch('/handler/?num=3');
});
Získejme odeslaná data na straně serveru:
export default {
'/handler/': function({get}) {
console.log(get.num); // vypíše 3
}
}
Něco s těmito daty udělejme a pošleme je zpět:
export default {
'/handler/': function({get}) {
return get.num ** 2;
}
}
Na straně klienta získáme výsledek a vypíšeme jej někam:
button.addEventListener('click', function() {
fetch('/handler/?num=3').then(
response => {
return response.text();
}
).then(
text => {
console.log(text);
}
);
});
Na klientovi je zadán div a tlačítko. Po stisknutí tlačítka odešlete na server dvě čísla. Nechte server najít součet předaných čísel. Výsledek zapište do divu.
Nechť je na serveru zadáno pole. Nechte server očekávat, že parametrem bude předáno číslo, a vracet prvek pole odpovídající tomuto číslu. Po stisknutí tlačítka předejte na server nějaké číslo a odpověď serveru vypište do odstavce.