Передача JSON с клиента в теле запроса через AJAX в PHP

В предыдущем уроке мы передавали данные с клиента в каком-то ключе метода GET или POST. Зачастую удобнее просто передать JSON с данными, не вводя никаких лишних ключей. Для этого нужно просто передавать данные в теле запроса:

script.jsbutton.addEventListener('click', function() {
  let data = [1, 2, 3];
  let json = JSON.stringify(data);
  
  let promise = fetch('ajax.php, {
    method: 'POST',
    body: json,
    'Content-Type': 'application/json',
  });
});

Получим эти данные на стороне сервера:

ajax.php<?php
  $json = file_get_contents('php://input');
?>

Преобразуем полученные данные в массив PHP:

ajax.php<?php
  $data = json_decode($json, true);
  var_dump($data); // массив
?>
Задание 1

Пусть на клиенте есть 5 инпутов. В эти инпуты вводятся числа. Получите массив введенных чисел, отправьте их на сервер. Пусть сервер вернет сумму переданных чисел.

Задание 2

Пусть на клиенте дан следующий массив:

javascriptlet arr = [
  {
    'name':     'prod1',
    'price':    100,
    'quantity': 5,
  },
  {
    'name':     'prod2',
    'price':    200,
    'quantity': 3,
  },
  {
    'name':     'prod3',
    'price':    150,
    'quantity': 7,
  },
  {
    'name':     'prod4',
    'price':    300,
    'quantity': 2,
  },
  {
    'name':     'prod5',
    'price':    250,
    'quantity': 4,
  },
];

Отправьте этот массив на сервер. Пусть сервер вычислит суммарную стоимость товаров и отправит это число обратно на клиент.