React и PHP

Перед выполнением задания, установите OpenServer Basic или MAMP. Создайте домен с любым удобным именем. Дальше это имя - сервера. Скопируйте в созданную папку файлы из папки backend шаблона. Убедитесь, что сервер запущен. Если вы используете MAMP то имя сервера будет начинаться с localhost.

По нажатию кнопки в блоке Время сервера - выполняется функция task1. Task 1 делает запрос на сервер по адресу ваш_сервер/api.php. (В моем примере я делал это на http://test1.ua/api.php). Данные для запроса:

• url: server/api.php
• method: POST
• content-type: application/x-www-form-urlencoded

Параметры

• action: 1

Формат ответа - string.

Выполните запрос на сервер с указанными параметрами, ответ сервера - год и время добавьте в стейт T1 и выведите в параграф под кнопкой.

По нажатию кнопки в блоке Случайное число между, выполняется submit формы. Событие submit вызывает функцию task2. Функция task2 используя event.preventDefault останавливает перезагрузку страницы.

Затем получает из event данные input num1, num2, после чего делает запрос на сервер. Данные для запроса такие же, как и в первом задании.

Параметры запроса:

• action : 2,
• num1: число из num1,
• num2: число из num2,
• форма ответа - строка

Если запрос выполнен верно, то сервер вернет случаное число между указанными ( включительно). Занесите число в стейт T2 и выведите его в параграф под формой.

По на нажатию на кнопку в блоке Создание файла выполняется submit формы. На форме событие onsumbit которое запускает функцию task3. Внутри функции task3 получите данные filename и filedata из input. Сделайте fetch запрос на сервер. Укажите параметры:

• action: 3
• filename : имя файла из filename,
• filedata: содержимое файла из filedata,
• форма ответа сервера - string ( количество записанных байт).

Если все выполнено верно, сервер в папке files создаст файл с указанным именем и содержимым и вернет размер записанных данных.

Проверьте размер записанных данных. Если он больше нуля, то в state T3 занесите имя созданного файла. Если нет - false.

В параграфе под форомй проверяйте T3 если он равен false выводите пустую строку. Если нет - выводите ссылку на скачивание файла с сервера.

По нажатию на кнопку в блоке Получение данных компьютера запускается task4. Task4 делает запрос на сервер, передавая параметр action : 4.

Если все сделано верно, то будет возвращена строка содержащая данные о вашей операционной системе. Запишите ее в T4 state и выведите в параграфе под кнопкой.

Мы все время делали запросы на свой сервер...

Завдання доступні після придбання курсу