GET kérések küldése AJAX-on keresztül JavaScriptben

Most pedig tanuljuk meg, hogyan kell adatokat küldeni a szervernek egy AJAX kérésben. A szerver majd valamit csinál ezekkel az adatokkal és visszaküldi nekünk az eredményt.

A teszt szerverünk feldolgozza az /handler/ címre küldött adatokat:

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

Kezdjük azzal, hogy küldjünk egy GET kérést:

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

Kapjuk meg a küldött adatokat a szerver oldalán:

export default {
	'/handler/': function({get}) {
		console.log(get.num); // kiírja a 3-at
	}
}

Csináljunk valamit ezekkel az adatokkal és küldjük vissza őket:

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

A kliens oldalán kapjuk meg az eredményt és írjuk ki valahova:

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

A kliens oldalon adott egy div és egy gomb. A gomb megnyomására küldjön két számot a szervernek. A szerver keresse meg az átadott számok összegét. Az eredményt írja be a div-be.

Legyen a szerveren adott egy tömb. A szerver várja, hogy paraméterként egy számot adnak át, és visszaadja a tömb azon elemét, amelyik ezzel a számmal egyezik. Egy gomb megnyomásakor küldjön egy számot a szervernek, a szerver válaszát pedig írja ki egy bekezdésbe.