Метод POST через URLSearchParams в AJAX в PHP

В данном уроке мы научимся передавать данные методом POST с помощью класса URLSearchParams.

Давайте посмотрим, как это делается. Для начала создадим объект этого класса:

let searchParams = new URLSearchParams();

Теперь добавим параметры с помощью метода set:

searchParams.set('num1', '1');
searchParams.set('num2', '2');

Теперь присвоим наш объект в настройку с телом запроса:

let response = await fetch('/ajax.php', {
	method: 'POST',
	body: searchParams,
});

Давайте соберем все вместе и сделаем отправку AJAX запроса по клику на кнопку:

button.addEventListener('click', async function() {
	let searchParams = new URLSearchParams();
	
	searchParams.set('num1', '1');
	searchParams.set('num2', '2');
	
	let response = await fetch('/ajax.php', {
		method: 'POST',
		body: searchParams,
	});
});

После отправки запроса имена, которые мы задавали с помощью метода set, станут именами ключей в массиве $_POST на стороне сервера:

<?php
	echo $_POST['num1']; // 1
	echo $_POST['num2']; // 2
?>

Дана форма с тремя инпутами. В инпуты вводятся числа. Отправьте эту форму через AJAX на сервер. Пусть сервер результатом вернет сумму чисел.