10 принципов идеальной формы авторизации и регистрации

Авторизация – что это такое?

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

. Помните о том, что обозначать ошибки одним лишь цветом может быть недостаточно.

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

шире, чем мы привыкли о них думать

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

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

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

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

Похожее:  Сайт для агентств - Туроператор TUI Россия

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

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

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

Аутентификация на основе токенов

Аутентификация на основе токенов в последние годы стала очень популярна из-за распространения одностраничных приложений, веб-API и интернета вещей. Чаще всего в качестве токенов используются Json Web Tokens (JWT). Хотя реализации бывают разные, но токены JWT превратились в стандарт де-факто.

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

Процедура аутентификации на основе токенов:

Что может случиться при ошибке авторизации

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

Лучший способ авторизации – это ее отсутствие.

Да, наш первый тезис является банальной и основной истиной UX – чем меньше действий требуется от пользователя, тем лучше. Зачастую, пользуясь некоторыми сайтами, у меня возникает вопрос: «Почему я должен регистрироваться здесь ради того, чтобы разово воспользоваться определенной услугой?».

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

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

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

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

Электронная почта должна быть альтернативой любому другому идентификатору пользователя.

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

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

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

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

Максимально компактное и близкое расположение форм регистрации и входа на сайте журнала TheVerge.

Простой и лаконичный язык.

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

Так или иначе, существует несколько разных подходов к выбору надписей на кнопках. Определенно, в большинстве случаев наиболее оправданным является использование лаконичных и однозначных надписей, таких как «Вход», «Войти», «Создать», «Присоединиться» и «Зарегистрироваться».

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

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

«SignIn» все чаще используется вместо любых других формулировок.   

Совместимость форм авторизации с менеджерами паролей различных браузеров.

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

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

Предупреждение и автоматическое исправление ошибок ввода.

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

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

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

Оставляйте возможность переключаться между полями ввода с помощью клавиши «Tab» и выделяйте элементы при таком переключении.

Да, несмотря ни на что, пользователи, все еще переключающиеся между полями формы при помощи клавиши «Tab», еще живы и вполне активны. К слову, автор этой статьи сам частенько пользуется Tab`ом при заполнении различных форм. И, между прочим, как горячая клавиша, Tab здорово ускоряет работу.

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

Фокусировка при переключении Tab`ом в Firefox и Chrome.

Как правильно ограничивать количество попыток авторизации или восстановления доступа к аккаунту.

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

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

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

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

Авторизация банковской карты и код авторизации

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

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

Если вы задаетесь вопросом: предавторизация по карте, что это, то объясним поэтапно. Клиент, расплачиваясь в магазине по безналу, вводит данные своей карты, такие как пин-код, или прикладывает карту к pos-терминалу. Затем банк, который обслуживает данный магазин, отправляет запрос в ваш банк-эмитент для проведения транзакции.

В этот момент клиент может увидеть на экране терминала надпись «авторизация». Это и есть предавторизация или холдирование средств. Банк-эмитент проверяет, если ли средства на карточке, в достаточном ли они количестве, затем переводит сумму денег на счет магазина.

Код авторизации – это уникальная шестизначная комбинация цифр.

Авторизация в веб: какой она может быть?

Хочется собрать все известные на сегодняшний день «простые» методы авторизации/регистрации на веб-ресурсах и их особенности в одном месте. (простые — в смысле не требующие специальных устройств, например смарт карт, устройств для сканирования отпечатков пальцев, сетчатки глаз и т.д.) Что ж, попробуем…

На данный момент мне известны такие способы:

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

2. Авторизация по OpenID
Довольно интересный метод авторизации, для осуществления которого необходима регистрация у т.н. «провайдера идентификации» и «зависимая сторона» — конечный ресурс (сайт), который пытается идентифицировать пользователя. Особенность данного метода заключается в том, что регистрация на самом сайте не требуется, а провайдер идентификации может быть один для многих сайтов.
Подробнее можно узнать например тут: http://ru.wikipedia.org/wiki/OpenID
Плюсы: один общий логин и пароль для одного провайдера, а значит и для всех ресурсов, удобство (не нужно запомниать множество учетных записей для разных сайтов), скорость использования, безопасность (пароль от учетной записи провайдера не передается конечному ресурсу (исключая случаи фишинга), а также исключен перехват)
Минусы: пока еще малая распространенность метода, сайты, необходимые большинству пользователей и поддерживающие OpenID можно пересчитать по пальцам, да и централизованность это тоже не всегда хорошо.
Примеры сайтов, использующих метод: ЖЖ, Мой круг
Пример провайдера идентификации: MyOpenID.com
Вариации метода: «цифровой паспорт .NET» — проприетарная разработка Майкрософт, однако получившая некоторое распространение.

Ну это из более-менее популярных. Теперь рассмотрим «экзотику»:

3. Enum — авторизация
Суть метода: привязка «аккаунта» мобильному телефону, номеру. При регистрации на сайте такого провайдера пользователю выдается ссылка, по которой он устанавливает java-приложение себе в телефон. Для авторизации, на сайтах поддерживающих этот метод пользователь вводит свой адрес электорнной почты, сайт в ответ показывает пользователю число, которое необходимо ввести в ранее установленное приложение. После ввода контрольного числа на экране мобильного телефона отображается число-результат, которое затем необходимо ввести обратно на сайт, на котором происходит авторизация.
Чем-то напоминает OpenID, поэтому и наследует некоторые его особенности:
Плюсы решения: простота реализации и пользования, безопасность (метод исключает перехват учетных данных, пригодных для повторной авторизации)
Минусы: малое распространение метода, привязка к телефону, который может быть украден или потерян, или просто может не находиться рядом в нужный момент. Пример enum-провайдера

4.
Я даже затрудняюсь как-либо назвать этот метод. Универсальный аккаунт чтоли. Впервые я увидел его на сайте Российского Jabber-сообщества Суть метода в том, что чтобы писать комментарии на этом сайте нужен зарегистрированный аккаунт, но не объязательно на самом jabber.ru, а вообще на любом jabber-сервере! Удобно на самом деле.
(на момент написания опуса метод не работает, происходит ошибка подключения к удаленному серверу и движок считает введенный пароль не верным, пробовал на аккаунте gmail.com, раньше вот работало…)
Ну с плюсами и минусами вроде очевидно: Jabber сейчас у многих, аккаунты есть — удобно. Но тут сразу возникает вопрос доверия сайту, ведь зайдя под своей учеткой один раз — недобропорядочный администратор может сделать это еще раз — это минус. Также все-таки сайт можно считать «тематическим» и подобный метод на другом сайте будет просто неоправдан, по причине различной аудитории.

5. Авторизация сертификатами
Не считаю нужным расписывать подробнее по той причине, что реализовано это может быть очень по-разному, от установки сертификата на компьютер (те же OpenID провайдеры, например MyOpenID.com) до более простого способа… Живую реализацию этого метода я видел и использовал только один раз — на форуме Античата — там можно после обычной регистрации зайти в профиль и скачать себе «сертификат» — файлик с ключем, затем запрятать его в укромное место и забыть. А вспомнить о нем только в случае потери пароля — сертификат поможет сбросить забытый пароль. Не авторизация в чистом виде, зато про сертификаты 🙂 Также можно почитать еще про сертификаты.

6. «Разовая» авторизация по ссылке
Сразу пример: после обычной регистрации на каком-нибудь форуме, на указанный электронный адрес высылаестя письмо со ссылкой — подтверждением адреса. Ссылка работает только один раз, цель у нее тоже одна — подтвердить что именно хозяин этого адреса зарегистрировался на том форуме, но при этом иногда при переходе по такой ссылке пользователь попадает сразу в свой аккаунт, не вводя логин и пароль, что тоже удобно. Подобный метод используется также для сброса пароля. В общем тоже метод авторизации.

Выводы:
Некоторые из этих методов чем-то похожи друг на друга, но обладают различным набором достоинств и недостатков. При этом 2 — 6 метод никак не обходятся без первоначальной «простой» регистрации и авторизации.
А это я все к чему? А к тому, что создавая очередной проект, вопрос авторизации/регистрации пользователей нужно хорошо продумывать.

ЗЫ Жду конструктивной критики.

UPD:
Всем спасибо за комментарии и исправления, также прошу прощения, что не смог принять активного участия в обсуждении — не было возможности из-за учебы. 🙂

Авторизация с помощью подключенного устройства

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

Например, для Mac OS X есть приложение KeyTouch, позволяющее авторизоваться на компьютере со сканом отпечатков пальцев со своего iPhone. Есть еще и Knock, который позволяет кликнуть по телефону, чтобы разблокировать компьютер.

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

10 принципов идеальной формы авторизации и регистрацииПриложение Tether для iPhone

В домашнем офисе я использую приложение Mac OS X и iOS под названием Tether («связка»). После однократной синхронизации компьютера и телефона компьютер блокируется и разблокируется — в зависимости от близости телефона к компьютеру.

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

Беспарольная авторизация

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

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

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

10 принципов идеальной формы авторизации и регистрацииАвторизация в Slack

У Slack есть очень хороший пример беспарольной идентификации. На разных этапах входа в систему и процессов сброса пароля сервис использует «волшебную ссылку» (magic link) для идентификации пользователей. Уникальный URL отправляется на электронный адрес пользователя, и этот URL открывает приложение и позволяет ему войти.

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

Биометрическая идентификация

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

Наиболее распространенный пример — Touch ID компании Apple. Такие вещи действительно восхищают. Биология — наша истинная идентичность, она всегда с нами. Мы знаем об идее разблокирования телефонов или планшетов при помощи отпечатка пальца. Тем не менее биометрическая идентификация используется и в других местах (и с другими параметрами).

Windows Hello — это перспективная система идентификации для Windows 10, соединяющая камеры с датчиками (на компьютерах и устройствах) для распознавания лица, радужки глаз или отпечатков пальцев. Нужно просто открыть компьютер и заниматься своими делами, не жертвуя при этом безопасностью. Этот тип идентификации был до недавнего времени невозможен, особенно в масштабе Windows 10.

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

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

Биометрическая идентификация только начинает развиваться, но некоторые API и библиотеки позволяют нам пользоваться биометрической идентификацией уже сегодня. К ним относятся BioID Web Service, KeyLemon, Authentify и Windows Biometric Framework API (на котором, как мне кажется, построена Hello).

Всё хорошо?

Почти. Данная система по-прежнему не защищает от кражи хэша из кук при открытом канале и отсутствии SSL. Кроме того, сложно обеспечить своевременную блокировку, если доступ к аккаунту утерян (особенно если взломщик уже сменил пароль). В этом случае очень помог бы сброс пароля через смс-команду с привязанного телефона — но для этого уже нужна возможность принимать и отправлять смс.

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

Двухфакторная авторизация

Двухфакторная идентификация — это еще одно расширение традиционной идентификации при помощи пароля. После проверки комбинации имени пользователя и пароля уникальный код или URL пересылается по электронной почте либо отправляется SMS-сообщением владельцу аккаунта, который пытается войти в систему.

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

10 принципов идеальной формы авторизации и регистрацииАвторизация в приложении Google


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

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

Google хорошо справляется с идентификацией. Компания используют правило «Доверять этому устройству 30 дней». Кроме того, она предлагает опцию двухфакторной аутентификации как один из вариантов и поощряет его применение, ни к чему не принуждая пользователей.

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

Двухфакторная аутентификация (2fa)

Двухфакторная аутентификация (2FA) улучшает безопасность доступа за счёт использования двух методов (также называемых факторами) проверки личности пользователя. Это разновидность многофакторной аутентификации. Наверное, вам не приходило в голову, но в банкоматах вы проходите двухфакторную аутентификацию: на вашей банковской карте должна быть записана правильная информация, и в дополнение к этому вы вводите PIN.

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

Делегирование полномочий

Давайте попробуем создать отдельный модуль. Назовём его совершенно бесхитростно — security.php, и оформим как отдельный скрипт. Будем подключать его ко всем закрытым страницам нашего проекта в самом начале. Внутри этого файла будем анализировать некие условия, а по итогам его работы выставлять специальный флаг в 0 или 1. Пусть этот флаг будет храниться в переменных сессии (массив $_SESSION в PHP).

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

Для чего нужна регистрация пользователя

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

Возникает вопрос: авторизация – что это и зачем лимитировать доступ при помощи нее? Ведь было бы намного проще предоставить возможности сайта всем пользователям. Тем более что процедура регистрации порой занимает не так уж и мало времени. Но есть одна весомая причина, по которой владельцы вводят авторизацию.

Данная информация передается добровольно, а также применяется исключительно с целью распознавания остальными посетителями.

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

Имя пользователя и пароль

Буду честен: у меня возникают проблемы с традиционной моделью. В идеальном мире я бы устранил пароли вообще, но в реальности я пользуюсь этим методом в 99% своих проектов.

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

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

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

Истоки проблемы

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

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

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


Для этого уже есть несколько методов и постоянно появляются новые. Традиционную аутентификацию при помощи пароля можно сделать комфортной и удобной. Вот актуальные способы:

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

Я буду оценивать каждый метод, исходя из нескольких факторов:

  • частота использования: легкость настройки и обслуживания;
  • безопасность: сложность идентификации для постороннего человека;
  • комфорт: простота идентификации для пользователя аккаунта.

Как быть?

Очевидно, с этим надо что-то делать. Да, можно сразу бежать покупать сертификат и подключать SSL. Но можно сделать кое-что ещё до этого, и существенно снизить тем самым необходимость в нём. В конце концов, в том же ВКонтакте SSL стал принудительным всего полгода назад, а до этого как-то ведь жили.

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

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

Как правильно написать авторизацию/аутентификацию?

С полного нуля. Пользователь вводит логин пароль:
Пользователь входит через ВК

Не имеет особого значения, ваша задача полученную информацию замапать на ID пользователя в ВАШЕЙ базе, с учетом необходимых проверок. ВК будет считаться доверенной стороной, т.е. ему вы доверяете процедуру проверки аутентичности юзера. Если аутентификация на вашей стороне – то проверяете вы (проверяете пароль по соленому хешу в базе, ну или как-то еще). Если у вас “быстрый вход” по ВК (без регистрации), то нужно сделать еще авторегистрацию, если userid не найден по данным от ВК. Правда, тут нужно быть готовым, что юзер захочет слинковать свои аккаунты, если он уже зарегался по логину/паролю. Ну или хотя бы предупредить при входе по ВК, что он в базе не найден и будет создан новый акк, чтобы он не удивлялся потом.

Что писать в куки

идентификатор сессии. Как уже сказали, должен быть сложным для копирования (скопированный идентификатор сессии – украденная сессия), уникальным. Погуглите алгоритмы или воспользуйтесь стандартыми. Сессии хранить или стандартными средствами, или попробовать редиску (там есть авто-expire, что приятно).

Если нужно, чтобы у пользователя был только одновременный доступ с одного устройства – как быть?

проверять наличие сессии для данного пользователя (по ID пользователя с этапа аутентификации). Если сессия уже есть – убивать ее, создавать новую (новое устройство успешно зайдет, старое – “разлогинится”). Юзеру правда ничего не помешает скопировать идентификатор сессии из кукисов на другой девайс, так что можете еще в сессию IP писать, или user-агента (поменялся – пересоздаем сессию).

А если с нескольких?

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

Как на каждой странице организовать проверку авторизован пользователь или нет?

идем в хранилище сессий (стандартные механизмы PHP/Redis), запрашиваем/стартуем сессию по идентификатору, пришедшему в куках. Если такой сессии нет (устарела, либо никогда и не было, идентификатор юзер сам придумал) – авторизацию не выполняем. Если сессия есть – то в зависимости от того, что мы там храним, либо достаем USERID, и пробиваем по основной БД его права, либо достаем права из самой сессии, если мы их там закешировали. “Выдача” прав – есть процедура авторизации. Теперь в зависимости от набора прав – меняем логику внутри скрипта. В больших системах применяют понятия ролей и групп – это все можно погуглить. Вкратце – при авторизации определяется, в каких группах состоит пользователь. Затем, по множеству групп сопоставляются роли, которые “играет” пользователь в системе (администратор данных/пользователей, администратор бэкапа, главбух, менеджер и т.д. и т.п.). Роли фиксированы, и зависят от логики приложения – в зависимости от имеющихся у пользователя ролей меняется и поведение приложения.

Также сейчас можно встретить claim-based подход, особенно в asp.net – тоже погуглите.

Что хранить в сессии?

Как минимум – USERID, но можно еще и закэшировать информацию о его правах, чтобы не читать постоянно ее из основной базы. Плюс, тут же хранить данные, относящиеся к САМОЙ сессии, например тот же IP входа, время входа и т.д. Тут зависит от задачи.

Кодовая фраза

10 принципов идеальной формы авторизации и регистрации

Секретные фразы безопаснее паролей, их легче запомнить. Об этом пишут уже больше десяти лет: от статьи «
Пароли-слова против паролей-фраз» в 2005 году до «Почему секретные фразы удобнее для пользователей, чем пароли» в 2022-м.

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

Хотите доказательств?
Zxcvbn — это проект Dropbox, определяющий надежность пароля. Другие сайты могут использовать Zxcvbn как определитель надежности пароля с открытым исходным кодом. В этой статье Dropbox есть статистика и сведения об истинной надежности различных паролей.

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

Впервые я использовал пароли-фразы с компанией интернет-банкинга
Simple, которая приветствует эксперименты и новые технологии, и они показали себя прекрасно. Мою фразу-пароль просто запомнить и легко набрать — особенно на мобильном телефоне.

Конкретизировать сообщение об ошибках ввода

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

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

Напоминать пользователю о правилах

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

10 принципов идеальной формы авторизации и регистрацииАвторизация на cайте BrowserStack

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

Ограничивать или исключать правила для паролей

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

10 принципов идеальной формы авторизации и регистрацииРегистрация на сайте GoDaddy

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

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

Показывать напечатанные символы скрытого пароля с возможностью их убрать

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

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

10 принципов идеальной формы авторизации и регистрацииПодсказки Люка Вроблевски


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

Предыстория

Осень 2022-ого. Примерно полтора года назад, когда мне случилось стать участником разработки проекта, где пользователей существенно больше пары десятков человек, я наконец-то впервые в своей жизни задумался о надёжности авторизации.

По сути, авторизация — это то, с чего начинается процесс взаимодействия зарегистрированного пользователя с системой (для незарегистрированного пользователя всё начинается с регистрации, и эти два процесса, как вы уже догадались, очень сильно взаимосвязаны). Я внезапно осознал, что во всех проектах, что я делал до этого, с безопасностью всё очень плохо.

Пример авторизации из жизни

Давайте представим ситуацию в очень законопослушной стране:

— Здравствуйте, гражданин, предъявите документы!

— А вы, собственно, кто? 

— Я лейтенант Иванов, 3-е отделение ППС, вот моё удостоверение.

— Ну-ка, дайте гляну фото. Да, действительно, вы Иванов из полиции, вот мой паспорт.

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

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

Стандартная реализация

Итак, сессия в PHP по умолчанию хранится в файле. Её id сохраняется в cookie (если куки отключены — задействуется механизм передачи через адресную строку, если это не отключено в конфигурации). Время жизни такой сессионной куки по умолчанию — до момента закрытия браузера (и обычно его никто не меняет).

Поэтому более продвинутые программисты реализуют галочку «запомнить меня», либо реализуют её функционал по умолчанию, без возможности отключить. Что они делают? Просто сохраняют в собственной куке айди пользователя. Но поскольку просто айди хранить как-то уж слишком стрёмно (любой может поставить любое число и получить доступ к произвольному аккаунту), то часто вместе с айди за компанию сохраняют и пароль. В открытом виде.

Если кто-то не понимает, чем это плохо — представьте себе, что у нас пользователь пользуется очень старым, либо очень плохо реализованным браузером. Мы ведь не можем гарантировать, что браузер надёжно шифрует куки? Да и вирусы всякие могут быть у пользователя на компьютере, и в случае особо серьёзной малвари может не спасти и шифровка — зловред может попытаться считать значения прямо из памяти, когда они расшифрованы.

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

Ну и самое главное — если у нас SSL используется только при авторизации (а на остальных страницах его решили отключить ради выигрыша в скорости, либо чтобы лучше работало промежуточное кэширование)… То наш пароль всё время передаётся открытым текстом.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *