Что такое валидация

Основные определения

Валидация

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

Данные

Это введенная пользователем информация, которая будет провалидирована (ФИО, адрес, город, номер телефона, ИНН и др.).

Критерии

Требования, которым должны соответствовать введенные данные (номер мобильного телефона должен состоять из 11 цифр, имя должно быть написано латинскими буквами и т.д.)

Задача валидации

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

Предмет валидации — данные, а не визуальные контролы. Логика в том, чтобы валидировать не контрол, а значение, которое будет записано в этот контрол. Валидация позволяет проверить данные до того, как они будут отправлены на сервер.

Виды валидации

В Wasaby существует три вида запуска валидации:

  • мгновенная;
  • при потере фокуса;
  • при отправке формы.

Чем раньше интерфейс сообщает об ошибке, тем лучше — пользователю проще вернуться и исправить ошибку.

Соответственно, самый быстрый способ сообщить об ошибке — мгновенная валидация. Она возможна только в тех случаях, когда в процессе ввода понятно, что значение некорректное. Чаще всего, такие ошибки связаны с неправильной раскладкой клавиатуры или вводом букв в цифровое поле (ИНН, номер телефона и другие). Для этих случаев обычно используют поля с масками: ввод неподходящих символов в них заблокирован.

Валидация при потере фокуса — основной вид запуска валидации. Валидация срабатывает сразу после потери фокуса, если значение в поле заполнено.

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

Валидация на клиенте и на сервере

Общий алгоритм валидации данных, введенных пользователем, можно представить следующим образом:

Рис. 1. Общий алгоритм валидации данных

Даже если данные будут проверены на клиенте, на сервере они должны будут пройти повторную проверку.

Таблица 1. Основные преимущества и недостатки валидации на стороне клиента и на стороне сервера
ПреимуществаНедостатки
КлиентВалидация данных на клиенте позволяет произвести предварительную проверку данных без отправки их на сервер. Процесс проверки будет быстрым, пользователь моментально увидит результат. Такая валидация позволяет избежать "забивания" канала передачи данных.У злоумышленников есть доступ к процессу валидации, соответственно, проверка данных на клиенте является небезопасной.
СерверПроцесс валидации безопасен, поскольку доступа к валидации на сервере у злоумышленников нет.Если валидировать данные только на сервере, канал передачи данных может быть перегружен лишними запросами, поскольку данные каждый раз будут перемещаться между клиентом и сервером.

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

Рис. 2. Схема из презентации "Server vs Client-side validation.", автор
Arnold Sullivan

Контролы с внутренней валидацией

Часть контролов поддерживают внутреннюю валидацию. Например, Controls/input:DateBase и Controls/dateRange:Input проверяют корректность введенных данных и показывают сообщение, если данные введены неправильно.

Такие контролы имеют внутри себя встроенный контейнер валидации и их можно не оборачивать внешним.

Валидаторы для Controls/input:DateBase передаются во внутренний контейнер валидации с помощью опции valueValidators, которая содежит массив валидаторов. Валидаторы проверяют значение опции value.

У Controls/dateRange:Input есть две опции startValueValidators и endValueValidators, которые содержат массивы валидаторов. Валидаторы проверяют значение опций startValue и endValue соотвественно.