Wysyłanie zapytań GET przez AJAX w JavaScript

Nauczmy się teraz przekazywać dane na serwer w zapytaniu AJAX. Serwer zrobi coś z tymi danymi i odeśle nam z powrotem wynik.

Nasz serwer testowy będzie przetwarzał dane wysłane pod adres /handler/:

button.addEventListener('click', function() {
	let promise = fetch('/handler/');
});

Na początek wyślijmy zapytanie GET:

button.addEventListener('click', function() {
	let promise = fetch('/handler/?num=3');
});

Pobierzmy wysłane dane po stronie serwera:

export default {
	'/handler/': function({get}) {
		console.log(get.num); // wypisze 3
	}
}

Zróbmy coś z tymi danymi i wyślijmy je z powrotem:

export default {
	'/handler/': function({get}) {
		return get.num ** 2;
	}
}

Po stronie klienta pobierzmy wynik i wypiszmy go gdzieś:

button.addEventListener('click', function() {
	fetch('/handler/?num=3').then(
		response => {
			return response.text();
		}
	).then(
		text => {
			console.log(text);
		}
	);
});

Po stronie klienta jest div i przycisk. Po kliknięciu przycisku wyślij na serwer dwie liczby. Niech serwer znajdzie sumę przekazanych liczb. Wynik zapisz w divie.

Niech na serwerze będzie dana tablica. Niech serwer oczekuje, że parametrem zostanie przekazana liczba, i zwróci element tablicy odpowiadający tej liczbie. Po kliknięciu przycisku przekaż na serwer pewną liczbę, a odpowiedź serwera wypisz w akapicie.