Создаём собственный простой to-do list. Часть 2

Создаём собственный простой to-do list. Часть 2

Введение

Продолжение первого урока который вышел неделю назад (Создаём собственный простой to-do list. Часть 1).
На этой недели мы будем работать с PHP, что бы принимать и обрабатывать данные полученные из форм и возвращать JSON ответ.

Установка PHP на ваш сервер

Есть несколько способов установки PHP на ваш веб-сервер, но каждый из них зависит от того, какой веб-сервер вы используете. С основными двумя мы будем иметь дело, это Microsoft Internet Information Services (IIS) и Apache. IIS будет работать только на Windows, в то время как Apache будет работать на любой Windows, OSX или на вашем любимом дистрибутиве Linux (например, Ubuntu).
Для каждой операционной системы есть несколько простых в использовании пакетов, которые будут устанавливать и настраивать как веб-сервер так и php.

Apache

Создаём собственный простой to-do list, apache
Самый простой пакет для Apache я думаю это XAMPP, он умеет работать со всеми основными платформами и очень прост в использовании. Вы можете загрузить его непосредственно с сайта на основе операционной системы и последовать инструкции по установке.
Создаём собственный простой to-do list, xampp

На сайте XAMPP есть информация о том, куда надо распаковать и где расположить ваши файлы, как создать псевдоним папки. Эти и другие темы освещаются в инструкции по установке.

IIS

Создаём собственный просто to-do list, iis
IIS как правило поставляется бесплатно в Windows, не устанавливается по умолчанию, но вы можете установить его через “Добавить/Удалить Программы” из Панели Управления в разделе “включение/Выключение Функции Windows” (подробное пошаговое руководство, можете найти здесь).
Простейший способ установки PHP это загрузить Microsoft Web Platform Installer. Он предложит вам для установки ряд программ, начиная с PHP и WordPress, и заканчивая разными платформами электронной коммерции. Все что вам надо сделать, это отметить галочками те приложения которые вы хотите установить и они будут автоматически установлены!

По умолчанию, файлы будут расположены в следующей папке C:\inetpub\wwwroot однако вы можете создавать “Виртуальные Папки”, там где вам захочется. Для продолжения урока сохраните файл index.html который мы создали в прошлом уроке в папку wwwroot или создайте виртуальную папку.

Начало работы

Предполагаю что вы настроили и запустили ваш веб сервер и PHP сконфигурирован, давайте начнем!
(Если у вас возникли проблемы или вопросы вы можете их задавайте в комментариях, чем смогу помогу.)

Во-первых, нам надо создать папку submit.php в той же папке где находится наш index.html а затем используя глобальную переменную PHP $_POST мы будем извлекать значения формы которые будет поступать с использованием jQuery.
PHP-код всегда завернут в <?php ?> теги, все что вне этих тегов, отображается как обычный HTML.

<?php
$name = $_POST["new-task-name"];
$date = $_POST["new-task-date"];
$desc = $_POST["new-task-desc"];
$email = $_POST["new-task-email"];
$priority = $_POST["new-task-priority"];
$color = $_POST["new-task-color"];
?>

Мы используем переменную $_POST вместо $_GET, потому что мы определили наш jQuery метод как «POST», это можно легко изменить, если вы предпочитаете использовать «GET».

Теперь, когда у нас есть данные формы, мы должны обеспечить некую проверку. Мы знаем, что нам нужны значения name, date и priority, но мы также знаем, что мы можем указать необязательные значения, как в случае с полем email, список адресов которого, будет разделен запятыми. Во-первых, нам надо разобраться с обязательными значениями, имеют ли они вообще какие либо значения и правильно ли они составлены.
Во-вторых, мы зададим некоторые значения по умолчанию, и будем обновлять переменные после того как мы подтвердим, что каждое значение формы было указано. Мы можем сделать это используя функцию empty.

<?php
$name = null;
$date = date('c');
$desc = null;
$email = null;
$priority = 2;
$color = '#ffffff';

if (!empty($_POST["new-task-name"]))
    $name = $_POST["new-task-name"];
if (!empty($_POST["new-task-date"]))
    $date = $_POST["new-task-date"];
if (!empty($_POST["new-task-desc"]))
    $desc = $_POST["new-task-desc"];
if (!empty($_POST["new-task-email"]))
    $email = $_POST["new-task-email"];
if (!empty($_POST["new-task-priority"]))
    $priority = $_POST["new-task-priority"];
if (!empty($_POST["new-task-color"]))
    $color = $_POST["new-task-color"];
?>

Мы также собираемся подтверждать, что значение даты указано в правильном формате, и что приоритетом является целой число. Это можно сделать используя функции DateTime и INTVAL. Используя функции explode и implode можно также конвертировать разделенные запятыми список адресов электронной почты в массив и обратно в строку.

<?php
$name = null;
$date = date('c');
$desc = null;
$email = null;
$priority = 2;
$color = '#ffffff';

if (!empty($_POST["new-task-name"]))
    $name = $_POST["new-task-name"];
if (!empty($_POST["new-task-date"]))
    $date = new DateTime($_POST["new-task-date"]);
if (!empty($_POST["new-task-desc"]))
    $desc = $_POST["new-task-desc"];
if (!empty($_POST["new-task-email"]))
    $email = explode(',', $_POST["new-task-email"]);
if (!empty($_POST["new-task-priority"]))
    $priority = intval($_POST["new-task-priority"]);
if (!empty($_POST["new-task-color"]))
    $color = $_POST["new-task-color"];
?>

Мы должны также обеспечить обратную связь с пользователем, если требуемые значения не установлены. Для этого мы будем возвращать объект JSON со значением true или false, мы также будем возвращать список сообщений, информирующее пользователя о том, что он должны сделать. Используя функцию json_encode, мы можем легко превратить наш массив $result в JSON.

<?php
$name = null;
$date = date('c');
$desc = null;
$email = null;
$priority = 2;
$color = '#ffffff';

$result = array();
$result['error'] = array();

if (!empty($_POST["new-task-name"]))
    $name = $_POST["new-task-name"];
else
    array_push($result['error'], 'Please specify a name for your task');

if (!empty($_POST["new-task-date"]))
    $date = new DateTime($_POST["new-task-date"]);
else
    array_push($result['error'], 'Please specify a date for your task');

if (!empty($_POST["new-task-desc"]))
    $desc = $_POST["new-task-desc"];

if (!empty($_POST["new-task-email"]))
    $email = explode(',', $_POST["new-task-email"]);

if (!empty($_POST["new-task-priority"]))
    $priority = intval($_POST["new-task-priority"]);
else
    array_push($result['error'], 'Please specify a valid priority for your task');

if (!empty($_POST["new-task-color"]))
    $color = $_POST["new-task-color"];

if(isset($result['error']) && count($result['error']) > 0){
    $result['success'] = false;
} else {
    $result['success'] = true;
    $result['name'] = $name;
    $result['date'] = $date->format('c');
    $result['desc'] = $desc;
    $result['email'] = implode(',', $email);
    $result['priority'] = $priority;
    $result['color'] = $color;
}

echo json_encode($result);
?>

На данном этапе создания собственного простого to-do list приложения, у нас после отправки формы должен высвечиваться какой-то ответ, либо с ошибкой либо с сообщением что данные формы добавлены в таблицу.

<?php
$name = null;
$date = date('c');
$desc = null;
$email = null;
$priority = 2;
$color = '#ffffff';

$result = array();
$result['error'] = array();

if (!empty($_POST["new-task-name"]))
    $name = $_POST["new-task-name"];
else
    array_push($result['error'], 'Please specify a name for your task');

if (!empty($_POST["new-task-date"]))
    $date = new DateTime($_POST["new-task-date"]);
else
    array_push($result['error'], 'Please specify a date for your task');

if (!empty($_POST["new-task-desc"]))
    $desc = $_POST["new-task-desc"];

if (!empty($_POST["new-task-email"]))
    $email = explode(',', $_POST["new-task-email"]);

if (!empty($_POST["new-task-priority"]))
    $priority = intval($_POST["new-task-priority"]);
else
    array_push($result['error'], 'Please specify a valid priority for your task');

if (!empty($_POST["new-task-color"]))
    $color = $_POST["new-task-color"];

if(isset($result['error']) && count($result['error']) > 0){
    $result['success'] = false;
} else {
    $result['success'] = true;
    $result['name'] = $name;
    $result['date'] = $date->format('c');
    $result['desc'] = $desc;
    $result['email'] = implode(',', $email);
    $result['priority'] = $priority;
    $result['color'] = $color;
}

echo json_encode($result);
?>

Теперь у нас проверяются и очищаются значения формы, мы также начали добавлять более сложную логику в наш собственный простой to-do list (в виде сообщений об ошибках).

В следующих уроках

На следующей неделе мы рассмотрим создание базы данных MySql и создания некоторых основных таблиц. Мы также обновим наш файл submit.php чтобы сохранять задания в базу данных и добавим функциональности к нашему to-do list приложению путем преобразования страниц из статического HTML в PHP и добавим в них простую аутентификацию. Безопасность файлов и базы данных требует отдельного урока, поэтому я буду рассматривать их в скором будущем уже более углублённо.

Следите за продолжением уроков по созданию собственной to-do list. Подписывайтесь на обновление по RSS, по почте или twitter.

comments powered by Disqus
Subscribe to RSS Feed Следить в Twitter