Отправка POST данных через fetch и FormData в JavaScript

В статье "Передача POST данных через fetch в JavaScript" был приведён пример кода для передачи данных методом POST, используя второй параметр функции fetch. В него передавался объект со свойствами method и body. Куда передаётс яназвание метода и объект URLSearchParams.

Сейчас мы поговорим об URLSearchParams. А точнее о его более мощном заменителе - FormData. Фактически, если в нашем примере простейшей авторизации на сайте мы изменим URLSearchParams на FormData, то никаких ошибок не будет. То есть вполне можно поменять это:
var params = new URLSearchParams(); 
params.set('login', login);
params.set('pass', pass);

fetch('/login_ajax.php', {
   method: 'POST',
   body: params
});
На это:
var params = new FormData(); 
params.set('login', login);
params.set('pass', pass);

fetch('/login_ajax.php', {
   method: 'POST',
   body: params
});
Но удобство FormData состоит в том, что при создании объекта этого класса ему можно передавать указатель на форму. Тогда из формы автоматически будут прочитаные все поля и занесены в объект, который будет передан в fetch. То есть можно тегу form поставить id равный "form" <form id="form">, а потом передать эту информацию в класс FormData:
var form = document.getElementById('form');
// form указывает на форму

var params = new FormData(form); 

fetch('/login_ajax.php', {
   method: 'POST',
   body: params
});
Можно сделать код ещё короче, убрав промежуточные переменные params и form:
fetch('/login_ajax.php', {
   method: 'POST',
   body: new FormData( document.getElementById('form') )
});
При этом данные полей будут переданы как раньше. То есть в PHP массиве $_POST можно будет найти ключи "login" и "pass" со значениями из полей формы.
MouseDC.ru - хостинг, виртуальный хостинг, покупка доменов, проверка доменов, WHOIS, курсы создания сайтов, вебинары по созданию, курсы разработки сайтов, доработка сайтов, сопровождение сайтов, разработка сайтов, техподдержка сайтов
Cмотрите другие статьи:
Была ли статья полезной?
Была ли эта статья полезна? Есть вопрос?
хостинг для сайтов
Закажите недорогой хостинг Заказать

всего от 290 руб

⇡ наверх