Invio di richieste GET tramite AJAX in JavaScript

Ora impariamo a trasmettere dati al server in una richiesta AJAX. Il server farà qualcosa con questi dati e ci invierà indietro il risultato.

Il nostro server di test elaborerà i dati inviati all'indirizzo /handler/:

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

Per iniziare, inviamo una richiesta GET:

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

Otteniamo i dati inviati lato server:

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

Facciamo qualcosa con questi dati e inviamoli indietro:

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

Lato client, otteniamo il risultato e visualizziamolo da qualche parte:

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

Sul client sono dati un div e un pulsante. Alla pressione del pulsante, invia al server due numeri. Lascia che il server trovi la somma dei numeri trasmessi. Il risultato va scritto nel div.

Sul server è dato un array. Lascia che il server si aspetti che venga trasmesso un numero come parametro, e restituisca l'elemento dell'array corrispondente a quel numero. Alla pressione di un pulsante, trasmetti al server un numero, e la risposta del server va visualizzata in un paragrafo.