GET pieprasījumu sūtīšana caur AJAX JavaScript

Tagad iemācīsimies pārsūtīt datus uz serveri AJAX pieprasījumā. Serveris kaut ko darīs ar šiem datiem un atgriezīs mums atpakaļ rezultātu.

Mūsu testa serveris apstrādās datus, kas nosūtīti uz adresi /handler/:

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

Vispars sāksim ar GET pieprasījuma sūtīšanu:

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

Iegūsim nosūtītos datus servera pusē:

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

Kaut ko darīsim ar šiem datiem un nosūtīsim tos atpakaļ:

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

Klienta pusē iegūsim rezultātu un izvadīsim to kaut kur:

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

Klientam ir dots div un poga. Nospiežot pogu, nosūtiet uz serveri divus skaitļus. Lai serveris atrod nosūtīto skaitļu summu. Rezultātu ierakstiet div.

Lai serverī ir dots masīvs. Lai serveris gaida, ka parametrs tiks nodots kā skaitlis, un atgriež masīva elementu, kas atbilst šim skaitlim. Nospiežot pogu, nosūtiet uz serveri kādu skaitli, un servera atbildi izvadiet rindkopā.