# Обработка POST запроса, отправленного с помощью thunk в Redux

Мы с вами получили данные продуктов и продавцов с сервера и вывели их в приложение. Но с помощью thunk можно не только получать, но и отправлять данные. Давайте узнаем, как это делать.

После того, как мы добавляем новый продукт, он остается у нас в store, то есть внутри нашего приложения. Давайте сделаем так, чтобы новый продукт сохранялся на сервере.

Давайте начнем с сервера. Здесь нам уже придется обработать не GET, а POST-запрос, поскольку на сервер теперь будут поступать данные продукта, которые мы и будем там сохранять.

Откроем наше приложение с продуктами, а в нем файл `server.js`. Найдем в нем массив `handlers` и добавим в него еще один обработчик для POST-запроса. Здесь мы будем принимать еще и тело запроса, поэтому в callback мы должны передать `request`:

`http.post('/fakeServer/products', async ({ request }) => {})`

Теперь в фигурных скобочках напишем код нашего колбэка. Для начала извлечем данные запроса и в случае ошибки отправим с сервера ответ, что мы не смогли сохранить данные и статус `500`:

`http.post('/fakeServer/products', async ({ request }) => { const data = await request.json() if (data.content === 'error') { await delay(ARTIFICIAL_DELAY_MS) return new HttpResponse('server save error', { status: 500, headers: { 'Content-Type': 'application/json', }, }) } })`

Если с данными все в порядке, то мы в базе данных найдем продавца по id, который нам пришел в запросе и впишем этого продавца в `data` (данные продавца ведь у нас тоже хранятся на сервере ;) ):

`const seller = db.seller.findFirst({ where: { id: { equals: data.seller } }, }) data.seller = seller`

Далее в базе данных создадим для этого продукта объект с реакциями. И теперь, имея все необходимые поля для продукта, создадим в базе и сам продукт:

`data.reactions = db.reaction.create() const product = db.product.create(data)`

Поставим задержку и в последней строчке кода для нашего колбэка вернем ответ с продуктом:

`await delay(ARTIFICIAL_DELAY_MS) return HttpResponse.json(serializeProduct(product))`

На этом мы полностью закончили с сервером и больше к нему не вернемся.

Кстати, еще одна полезная вещь. После строчки `export const worker = setupWorker(...handlers)` вы можете добавить следующий код:

`worker.listHandlers().forEach((handler) => { console.log(handler.info.header) })`

И теперь вы сможете видеть результат срабатывания каждого обработчика в консоли браузера.

Конечно же наш сервер ненастоящий и если мы будем принудительно обновлять страницу в браузере, то все наши новые объекты с продуктами исчезнут.

Откройте ваше приложение со студентами. Откройте в нем файл `server.js`. Добавьте в массив `handlers` бработку POST-запроса. В теле этого запроса вы будете принимать данные нового добавленного студента.

В теле callback для вашего `http.post` распакуйте данные и в случае ошибки отправьте соответствующий ответ.

Если же все ок, то найдите в базе данных преподавателя по полученному id и впишите его в данные. Впишите также в данные, созданный на основе базы данных объект `votes`.

По собранным данным создайте объект `student` с новым студентом и отошлите его в ответе сервера.

← →
↑