Как преобразовать объект FormData в JSON

JSON JavaScript Object Notation, это текстовый формат представления данных в нотации объекта JavaScript. Предназначен JSON, также как и некоторые другие форматы такие как XML и YAML, для обмена данными.

У нас есть форма:

<form method="post" name="student">
<input type="text" id="name" name="student_name" />
<input type="text" id="mail" name="student_email" />
<input type="password" id="password" name="student_password" />
<button type="submit">Submit</button>
</form>

Получаем объект FormData и преобразовываем в JSON:

document.querySelector("button[type=submit]").addEventListener("click", (event) => {
// отмена действия кнопки
event.preventDefault();
// находим форму по name="student"
let form = document.forms["student"];
// создаем пустой объект
var object = {};
// получаем через метод FormData нашу форму
let data = new FormData(form);
// перебираем поля формы
data.forEach(function (value, key) {
// создаем классический объект
object[key] = value;
});
// сериализуем объект в Json
var json = JSON.stringify(object);
// выводим результат в консоль
console.log(json);
});

Получение данных на сервере

К примеру вам нужно отправить json сериализованную строку, передавать это нужно через POST запрос, длина GET запроса ограничена 4мя килобайтами. Если попытаться получить GET запрос через суперглобальную переменную $_POST, нечего не выйдет!

Данные, которые могут быть обработаны через $_POST:

application/x-www-form-urlencoded тип application/x-www-form-urlencoded для простых форм application/x-www-form-urlencoded
multipart/form-data-encoded в основном multipart/form-data-encoded для загрузки файлов

Перечисленное выше, это единственные типы контента которые должны поддерживаться браузерами. Поэтому сервер и PHP традиционно не ожидают получения какого-либо другого типа контента.

Если много работаете с Ajax, может понадобиться обмен более сложными данными с типами строка, int, bool и структурами массивы, объекты, поэтому в большинстве случаев JSON является лучшим выбором:

{"key1":"value1","key2":"value2","key3":"value3"}

Содержимое будет иметь заголовок application/json он не пречислен в поддерживаемых по умолчанию, так что переменная $_POST из PHP не знает, как с этим справиться.

Получить запрос можно в сыром виде с помощью нераспределенного запроса PHP:

file_get_contents('php://input');