Здравствуйте уважаемый посетитель!

В предыдущих разделах мы создали основные элементы сайта, а также рассмотрели вопросы, связанные с наполнением контента. И теперь можем перейти к следующей довольно важной и обширной теме - к работе с формами HTML.

HTML-формы важнейшие элементы взаимодействия, определяющие интерактивную часть веб-страницы. Без которых не может обойтись ни один полноценный сайт. Ведь именно с их помощью осуществляется основной обмен между пользователем и стороной сервера.

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

Причем здесь также будут затронуты и вопросы работы с базой данных MySQL. Так как применение форм в наших примерах будет неразрывно связано с их взаимодействием с таблицами БД. В которых будут сохраняться введённые пользователями данные, используемые в дальнейшем сервером при обработке запросов.

Здравствуйте уважаемый посетитель!

Сегодня, используя соответствующие элементы, создадим форму онлайн заказа, в которой будут выполняться следующие действия:

1. ввод данных об автомобиле (марка автомобиля, модель, год выпуска, последние 6 цифр VIN, страховая компания);
2. выбор способа маркировки и определение стоимости (вид заказа, цена сервис-центра, цена со скидкой);

   И посмотрим, как для получения возможных опций полей, с помощью PHP можно совместить работу формы с информацией, хранящейся в базе данных MySQL.

   Такое формирование элементов позволит существенно уменьшить объем HTML-кода формы. А также даст возможность в дальнейшем, в случае необходимости, менять их значения без какого-либо вмешательства в HTML-код страницы. Внося нужные изменения только в соответствующие таблицы базы данных.

   Кроме того, здесь же рассмотрим взаимодействие данной формы с клиентским языком "JavaScript", автоматизируя получение значений некоторых полей.

   При этом следует отметить, что в данной статье будут затронуты вопросы, связанные только с созданием формы и ее функционала. А стилизацией внешнего вида полей и ее отправкой займемся позднее в следующих статьях.

   Читать дальше

Здравствуйте уважаемый посетитель!

В прошлой статье мы создали форму онлайн заказа. А сегодня с помощью CSS займемся стилизацией ее полей.

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

Следует отметить, что такое подробное рассмотрение оформления элементов формы с помощью стилей CSS будет сделано только для ранее созданной формы онлайн заказа.

В дальнейшем, для других форм, основное внимание будет уделяться вопросам их создания и обеспечения функционала. Рассмотрение же аналогичных действий по стилизации форм, ввиду их однотипности, проводиться не будет.

Здравствуйте уважаемый посетитель!

Сегодня создадим форму регистрации, предназначенную для ввода данных аккаунта при выполнении онлайн заказа. В результате чего, с помощью логина и пароля клиенты смогут входить в личный кабинет для получения информации об оформленных заказах. Поэтому в нашем случае элементы регистрации можно рассматривать в качестве одного из разделов ранее созданной формы онлайн заказа.

Следует отметить, что основное внимание здесь будет уделено вопросам создания HTML-элементов и валидации заполнения полей формы на стороне клиента.

При этом для всех полей, за малым исключением, применять инструменты валидации будем используя широкие возможности HTML5. В сравненим с предыдущими версиями HTML, когда для этих целей приходилось заниматься составлением на JavaScript различных скриптов, теперь этот вопрос решается куда проще. В чем на практике мы сможем убедиться.

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

Что касается стилизации элементов с помощью стилей CSS, то здесь мы этот вопрос рассматривать не будем. Так как об этом достаточно подробно рассказывалось в предыдущей статье на примере элементов других разделов формы онлайн заказа. И повторяться, наверное, не стоит.

Здравствуйте уважаемый посетитель!

Сегодня создадим дополнительные инструменты проверки правильности ввода пароля. Ведь людям свойственно ошибаться, и очевидно, что такое может случаться и при заполнении таких полей.

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

В предыдущей статье, используя регулярное выражение в атрибуте pattern, мы уже обеспечили корректность ввода для поля "Пароль" в соответствии с шаблоном. Который допускает ввод только цифр и букв латинского алфавита в количестве не менее 6-ти.

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

В первом случае будут проверяться значения полей в ходе их заполнения. Что позволит пользователю контролировать корректность ввода комбинаций символов до отправки формы.

На втором этапе будет осуществляться валидация пароля в момент отправки формы. И в случае несоответствия, форма будет блокироваться с выводом сообщения об ошибке.

Здравствуйте уважаемый посетитель!

В предыдущих статьях мы подготовили форму оформления заказа используя инструменты проверки корректности ввода данных на стороне клиента. Для этого сначала использовали встроенные возможности HTML5, а затем для проверки ввода пароля дополнительно создали скрипты JavaScript.

Таким образом мы обеспечили проверку ввода данных без перегрузки страницы и, соответственно, без лишней потери времени для пользователя. А кроме того обеспечили блокировку отправки формы в случае наличия каких либо ошибок.

Однако, только одной такой проверки на стороне клиента будет недостаточно. Требуется также выполнять валидацию формы и на стороне сервера. Это обусловлено в первую очередь соображениями безопасности от действий злоумышленников.

Ведь при желании совсем несложно изменить в браузере HTML-код веб-страницы сайта с целью отключения в нем проверки данных в форме, предусмотренные языком описания структуры веб-страниц. В данном случае HTML5.

В случае же если на сайте для проверки формы на стороне клиента применены специально созданные скрипты, то не трудно в браузере отключить JavaScript и вводить в поля все, что заблагорассудится. Включая различные теги и другие запрещенные комбинации символов, которые могут нанести серьезный вред работе сайта.

Поэтому, для защиты сайтов от злоумышленников в части, касающейся вводимых данных в формы, и применяется их валидация на стороне сервера.

Существует большое количество разных вариантов проверок форм на серверной стороне. Достаточно для этого в поиске сделать соответствующий запрос. В нашем же случае мы создадим такой инструмент на PHP с использованием универсальной пользовательской функции. Что позволит существенно сократить объем используемого PHP-кода, необходимый для реализации требуемого алгоритма проверки.

Думаю, что представленный здесь вариант валидации формы на стороне сервера будет интересен пользователям. Тем более, что с помощью предложенной функции можно выполнять проверку и обработку данных форм различных вариантов. А при необходимости, можно ее дополнить и другими функциональными возможностями.

Здравствуйте уважаемый посетитель!

В предыдущих статьях мы выполнили все необходимые подготовительные мероприятия - сформировали HTML-элементы формы, обеспечили проверку данных на стороне клиента, а затем получили данные в PHP с валидацией формы на стороне сервера. И теперь можем заняться и ее отправкой.

В связи с тем, что при отправке созданной формы онлайн заказа данные должны быть определенным образом сохранены, основное внимание здесь будет уделено взаимодействию формы с базой данных MySQL.

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

При этом, для того, чтобы обеспечить достоверность сохраненных данных, в рассматриваемом варианте будет предусмотрена проверка результатов выполнения с выводом соответствующих сообщений в окне браузера.

Здравствуйте уважаемый посетитель!

В предыдущей статье при отправке данных из формы для защиты пароля от взлома мы применили специальное односторонне преобразование (хеширование).

В результате, из сравнительно простого пароля, состоящего из 6-ти цифр и букв латинского алфавита, получили довольно сложную комбинацию из 60 символов. И которую, в конечном итоге, сохранили в базе данных в качестве одного из параметров созданной учетной записи пользователя.

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

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

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

Здравствуйте уважаемый посетитель!

В предыдущей статье на примере простой хеш-функции MD5 мы рассмотрели способы, которые позволяют создавать достаточно устойчивые от взлома хеши. Но для того, чтобы обеспечить должную сложность восстановления пароля, необходимо было создать отдельный PHP-скрипт, реализующий нужное замедление MD5-функции с применением сформированной соли.

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

В частности, будет рассмотрен вариант использования функции crypt() с Blowfish-шифрованием и добавлением к параметру алгоритма "Blowfish автоматически генерированной уникальной "соли". Данный метод создания хеша ранее был применен при создании скрипта для отправки формы онлайн заказа.

В качестве второго варианта будет приведен пример использования встроенного API (интерфейс прикладного программирования, англ. application programming interface) хэширования паролей.

В котором сначала одной из функций API password_hash() будет создан хеш пароля, а затем другой функцией password_verify() будет проведена проверка на соответствие хеша вновь введенному паролю.

При этом следует отметь, что второй вариант, с применением API хэширования паролей возможен только при работе с определенными версиями PHP, а именно: с версии 5.5 и выше. Поэтому, кто в своей работе пользуется более ранними версии PHP, это обстоятельство необходимо учитывать при выборе способа хеширования.

Здравствуйте уважаемый посетитель!

Сегодня, после небольшого перерыва, снова вернемся к рассмотрению вопросов, связанных с формами HTML.

Ранее мы создали форму регистрации, с помощью которой обеспечили запись в БД MySQL учетных данных пользователей. Где в качестве логина предусмотрели ввод комбинации символов в соответствии с установленным шаблоном. А пароль, в целях защиты от взлома, с сохранением в виде необратимых хешей.

А теперь создадим форму авторизации, которая должна будет обеспечить проверку пользователя путем сравнения введенного в форму логина и пароля с ранее сохраненными в базе данных учетными записями имеющихся зарегистрированных пользователей.

Следует отметить, что сама по себе форма авторизации не решает все вопросы разграничения прав доступа пользователей к ресурсам сайта. Она позволяет произвести лишь только аутентификацию, предусматривающую проверку подлинности пользователя, осуществляющего попытку входа в систему.

Что касается механизма авторизации, то это более сложная задача, чем просто аутентификация. Здесь должен быть предусмотрен кроме проверки на правильность ввода данных аккаунта пользователя, еще и другой, необходимый функционал для предоставления конкретному лицу прав на выполнение определённых действий.

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

Поэтому в этой статье форма авторизации будет рассмотрена только в части создания ее HTML-элементов и проведения проверки на совпадение введенных в форму логина и пароля с ранее сохраненными в базе данных учетными записями.

Взаимодействие же этой формы с другими функциональными узлами системы авторизации будут рассмотрены позднее в отдельном разделе, непосредственно предназначенном для рассмотрения вопросов, относящихся к обеспечению контроля доступа пользователей к ресурсам системы после успешного прохождения ими аутентификации.