Stuur GET versoeke via AJAX in JavaScript

Laat ons nou leer hoe om data na die bediener in 'n AJAX versoek te stuur. Die bediener sal iets met hierdie data doen en die resultaat na ons terugstuur.

Ons toetsbediener sal data verwerk wat gestuur is na die adres /handler/:

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

Laat ons begin deur 'n GET versoek te stuur:

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

Laat ons die gestuurde data kry op die bedienerkant:

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

Laat ons iets met hierdie data doen en dit terugstuur:

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

Op die kliëntkant kry ons die resultaat en vertoon dit iewers:

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

Op die kliënt word 'n div en 'n knoppie gegee. Wanneer die knoppie gedruk word, stuur twee getalle na die bediener. Laat die bediener die som van die oorgedraagde getalle vind. Skryf die resultaat in die div.

Laat daar 'n skikking op die bediener wees. Laat die bediener verwag dat 'n getal as parameter oorgedra word, en laat dit die skikkingelement terugstuur wat by hierdie getal hoort. Wanneer die knoppie gedruk word, stuur 'n sekere getal na die bediener, en vertoon die bediener se antwoord in 'n paragraaf.