Odesílání POST požadavků přes AJAX v JavaScriptu

Nyní pošleme na server POST požadavek. K tomu má funkce fetch druhý parametr s nastaveními. V nastavení method se určuje metoda HTTP požadavku. Zadejme metodu POST:

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

Pojďme také zadat data, která chceme odeslat na server. V POST požadavcích se data přenášejí v těle HTTP požadavku. K tomu je třeba data uvést v nastavení body. Uveďme je ve formě Query String, a jejich typ nastavme odpovídajícím MIME typem:

button.addEventListener('click', function() {
	let promise = fetch('/handler/', {
		method: 'post',
		body: 'num1=1&num2=2',
		headers: {
			'Content-Type': 'application/x-www-form-urlencoded',
		},
	});
});

Získáme tato data na serveru, něco s nimi provedeme a pošleme je zpět:

export default {
	'/handler/': function({ post }) {
		return Number(post.num1) + Number(post.num2);
	}
}

Na klientovi je dán div a tlačítko. Po kliknutí na tlačítko odešlete na server tři čísla metodou POST. Nechť server najde součet předaných čísel. Výsledek zapište do divu.