Senden von GET-Anfragen über AJAX in JavaScript

Lassen Sie uns nun lernen, Daten an den Server in einer AJAX-Anfrage zu senden. Der Server wird etwas mit diesen Daten machen und uns das Ergebnis zurückschicken.

Unser Testserver wird die an die Adresse /handler/ gesendeten Daten verarbeiten:

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

Lassen Sie uns zunächst eine GET-Anfrage senden:

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

Lassen Sie uns die gesendeten Daten auf der Serverseite abrufen:

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

Lassen Sie uns etwas mit diesen Daten machen und sie zurückschicken:

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

Auf der Clientseite holen wir das Ergebnis und geben es irgendwo aus:

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

Auf dem Client sind ein Div und ein Button gegeben. Bei Klick auf den Button senden Sie zwei Zahlen an den Server. Lassen Sie den Server die Summe der übermittelten Zahlen finden. Das Ergebnis schreiben Sie in das Div.

Angenommen, auf dem Server ist ein Array gegeben. Der Server erwartet, dass eine Zahl als Parameter übergeben wird, und gibt das Element des Arrays zurück, das dieser Zahl entspricht. Bei Klick auf einen Button übermitteln Sie an den Server eine bestimmte Zahl, und die Antwort des Servers geben Sie in einem Absatz aus.