Как провести авторизацию пользователя в приложении яндекс
Директор студии Surf Владимир Макеев написал для ЦП обзор форм авторизации, которые используются в мобильных приложениях — как её показывать, как сократить для пользователя время заполнения, что нельзя забыть при входе через соцсети и как сделать авторизацию через смартфон проще.
Как в сексе: чем позже — тем лучше
Заставляете пользователя проходить авторизацию или регистрироваться в вашем приложении сразу после того, как он его загрузил и открыл в первый раз? Значит, увеличиваете шансы приложения незамедлительно оказаться в корзине. Это подтверждается статистикой, поэтому наш первый совет: вставляйте авторизацию до момента, когда она действительно необходима. Это может быть отправка заказа или создание комментария. Вот небольшая статья на тему.
Основные способы входа в приложение, которые сегодня широко используются, — это логин и пароль, соцсети, телефон и код из SMS. Разберем подробнее первый из названных способов.
Логин и пароль
Если пользователю приходится вводить личные данные, наша задача — упростить для него этот процесс.
Подсказки к полям ввода
Немного терминологии
В простых формах, например, если мы используем привычный ввод логина и пароля, мы можем расположить названия полей в placeholders — это достаточно очевидно для пользователя. В более сложной форме, где есть ограничения на ввод данных, мы должны использовать labels и placeholder — например, пояснение к длине пароля. Labels и placeholders лучше размещать над полем ввода, так для пользователя в любой момент очевидно, что он заполняет, и как это следует делать.
В мобильных приложениях не лучшая практика — располагать label в одной строке с полем ввода. Это съедает полезное горизонтальное пространство. Например, форма регистрации Lamoda iPhone.
Автодополнения
- Автодополнение популярных доменов. iOS-библиотека от HotelTonight ускоряет ввод e-mail на основе базы популярных почтовых доменов. В Android можно сделать то же самое вручную. Все это приятно ускоряет ввод email.
Автодополнение популярных почтовых доменов - Автодополнение email по аккаунтам Google. Android-приложение может получить список Google-аккаунтов устройства и предлагать пользователю автодополнение. Так делают, к примеру, Evernote и Instagram. Можно действовать по-другому: автоматически заполнять поле ввода одним из электронных адресов. Так как у большинства пользователей один аккаунт Google, велика вероятность, что мы угадаем. Так поступают Facebook и Twitter. iOS не даёт доступа к email пользователя, поэтому сделать такой автокомплит нельзя. Автоподолнение почты по аккаунтам Google в Evernote
- Автодополнение имени. На стороне сервера или в приложении можно сохранить базу популярных имён и предлагать пользователю автодополнение. В Android, опять же, может помочь Google+. Но это все же неоднозначный способ — ведь ввод имени занимает пару секунд, а любой автокомплит в какой-то степени отвлекает пользователя.
- Автодополенение ранее использованного логина при авторизации. Если в приложении нет переключения между аккаунтами, как в официальном Twitter или Gmail, полезно при входе автодополнять ранее использованные email и логины. Например, Instagram показывает последний использованный логин. Правда, такой способ не подходит для финансовых приложений, так как в них важна безопасность. Если пользователь вышел из приложения, то никто не должен знать, какой логин он использовал.
- Автоопределение пола. Приложения могут определять пол по введённому имени. Сервис genderize.io содержит базу из 200 тысяч имён, 79 стран и 89 языков. 100 тысяч запросов в месяц стоят $9. Есть SDK для обеих платформ. В Android можно попробовать получить пол из аккаунта Google+. К сожалению, он не всегда проставлен пользователем, а в России Google+ вообще мало используют.
- Автодополнение адреса ускоряет ввод в формах оформления заказа, иногда такое поле присутствует в форме регистрации. Есть хороший обзор сервисов, решающих задачу.
Пароли
В приложении сложно вводить пароль дважды. Достаточно это делать один раз, а если ввод произошёл с ошибкой, у пользователя должна быть возможность изменить или восстановить пароль.
Пароль при вводе принято скрывать точками. Полезна кнопка «показать пароль» — она особенно важна на экране регистрации, если мы не просим пользователя ввести пароль дважды. Это интересно реализовано в спортивных трекерах Runtastic: пароль отображается, кнопка «глаз» зажата.
Восстановление пароля — задача не первостепенная. В большинстве топовых приложений пользователя для этого отправляют на веб-страницу. Восстановление не должно быть отдельным экраном, открывающимся в браузере, его можно реализовать на экране авторизации с помощью простых анимаций. Отличные примеры: Airbnb, Tumblr, Runtastic.
Проверка полей, клавиатуры и оферта
Правильность заполнения полей важно проверять в самом приложении. Валидация на стороне сервера занимает время пользователя, и это его раздражает. Это правило относится и к проверке доступных логинов и email, которая должна работать «на лету». Хорошие примеры — « Яндекс.Музыка», Twitter.
Для всех разных типов полей важно использовать соответствующие типы клавиатуры: iOS, Android. Если пользователь вводит почту, на клавиатуре должен быть знак @, цифры для ввода номера и прочее. Вы знаете, что никто не читает оферту. Думаю, что чекбокс соглашения с ней избыточен — он отвлекает пользователя от контента. Достаточно разместить текст «Зарегистрировавшись, вы соглашаетесь с политикой конфиденциальности и условиями предоставления услуг», нужное выделив ссылками.
Соцсети
Это простейший для пользователя способ входа: ему не нужно заполнять логин и пароль вручную. Кнопки соцсетей резонно сортировать по частоте использования в зависимости от платформы и страны. Google+ удобнее для Android, «ВКонтакте» есть у большинства пользователей в России. Так поступает сервис Foursquare в Android.
Когда пользователь входит через соцсеть, он ожидает, что сразу попадёт в приложение. Многие приложения просят ввести дополнительную информацию, что раздражает.
Со стороны технологий для реализации входа можно использовать универсальные OAuth-библиотеки, либо официальные SDK соцсетей. У официальных SDK есть важное преимущество: они производят авторизацию через установленные приложения либо через аккаунты пользователя в системных настройках. Если пользователь авторизуется через соцсеть, с большой вероятностью у него установлено соответствующее приложение.
Номер телефона и код подтверждения
Валидация ввода номера — задача непростая из-за проверки страны и маски ввода. Здесь отчасти может помочь библиотека от Google.
В Android можно сделать автокомплит номера из SIM-карты, однако это работает не на всех устройствах, поэтому в коде нужно учитывать возможные ошибки. На практике я не нашёл приложений, которые так делают, но применение такого способа вполне допустимо.
После ввода и отправки номера пользователю нужно ввести код из SMS. Android-приложение может делать это автоматически. Этот прием используют Viber, Telegram, Rocketbank. Важно лишь объяснить пользователю, что скоро придёт SMS, нужно только немного подождать.
Fabric Digits. У Twitter есть бесплатное готовое решение для авторизации через телефонный номер. Это SMS-шлюз, мобильные и веб-SDK. Внешний вид интерфейса в определённых рамках можно настраивать. Это наиболее простое решение задачи из коробки.
Fabric Digits
Если вы включили двухфакторную аутентификацию, вы сможете войти с помощью одноразового пароля на любой сервис или в приложения Яндекса. Если вы добавили несколько аккаунтов в Яндекс.Ключ, перед вводом пин-кода не забудьте переключиться на нужный аккаунт. Еще вы можете войти на некоторые сервисы Яндекса с помощью QR-кода.
Для входа в сторонние приложения и программы (почтовых клиентах, мессенджерах, сборщиках почты и т. п.) используйте пароли приложений.
Внимание. Приложения, разработанные в Яндексе, требуют именно одноразового пароля — даже правильно созданные пароли приложений не подойдут.Вы можете ввести одноразовый пароль при входе на сервисы или в приложения Яндекса.
Примечание. Одноразовый пароль нужно успеть ввести, пока он отображается в приложении. Если до обновления осталось слишком мало времени, просто дождитесь нового пароля.Чтобы получить одноразовый пароль, запустите Яндекс.Ключ и введите пин-код, который вы задали при настройке двухфакторной аутентификации. Приложение начнет генерировать пароли раз в 30 секунд.
Вы можете скопировать текущий пароль из Яндекс.Ключа в другое приложение. Для этого нажмите значок рядом с паролем. Одноразовые пароли нет смысла сохранять в браузере или где-то еще. Даже если вы не используете какой-либо пароль сразу, очень скоро он перестанет работать.Яндекс.Ключ не проверяет введенный вами пин-код и генерирует одноразовые пароли, даже если вы ввели свой пин-код неправильно. В этом случае созданные пароли также будут неверными и войти с их помощью не получится. Чтобы ввести правильный пин-код, достаточно выйти из приложения и запустить его снова.
Некоторые сервисы (например, главная страница Яндекса, Диск и Почта) позволяют войти на Яндекс, просто наведя камеру на QR-код. При этом ваше мобильное устройство должно быть подключено к интернету, чтобы Яндекс.Ключ мог связаться с сервером авторизации.
Чтобы войти с помощью QR-кода:
Нажмите значок QR-кода в браузере.
Если такого значка нет, значит войти на этот сервис можно только с помощью пароля. В этом случае вы можете войти в аккаунт с помощью QR-кода, а затем перейти к нужному сервису.
Войдите в приложение Яндекс.Ключ на вашем устройстве с помощью пин-кода и нажмите Войти по QR-коду . Наведите камеру вашего устройства на QR-код в браузере.Приложения или сайты, которым нужен доступ к вашим данным на Яндексе, иногда требуют ввести пароль, чтобы войти в аккаунт. В таких случаях одноразовые пароли не сработают — для каждого такого приложения необходимо создать отдельный пароль приложения.
Внимание. В приложениях и сервисах Яндекса работают только одноразовые пароли. Даже если вы создадите пароль приложения, например, для Яндекс.Диска, войти с его помощью не получится.Перенос Яндекс.Ключа
Вы можете перенести генерацию одноразовых паролей на другое устройство или настроить Яндекс.Ключ на нескольких смартфонах одновременно. Это можно сделать двумя способами:
Используйте резервную копию данных.
Восстановите данные. Теперь вы можете пользоваться Ключом на новом устройстве так же, как и на старом.Несколько аккаунтов в Яндекс.Ключе
Один и тот же Яндекс.Ключ можно использовать для нескольких аккаунтов с одноразовыми паролями. Чтобы добавить в приложение еще один аккаунт, при настройке одноразовых паролей на шаге 3 нажмите в приложении значок . Кроме того, вы можете добавить в Яндекс.Ключ генерацию паролей для других сервисов, поддерживающих такую двухфакторную аутентификацию. Инструкции для самых популярных сервисов приведены на странице о создании кодов проверки не для Яндекса.
Чтобы удалить привязку аккаунта к Яндекс.Ключу, нажмите и удерживайте соответствующий портрет в приложении, пока справа от него не появится крестик. Когда вы нажмете на крестик, привязка аккаунта к Яндекс.Ключу будет удалена.
Внимание. Если вы удалите аккаунт, для которого включены одноразовые пароли, вы не сможете получить одноразовый пароль для входа на Яндекс. В этом случае будет нужно восстанавливать доступ.Отпечаток пальца вместо пин-кода
Если устройство оснащено сканером отпечатков пальца, отпечаток пальца можно использовать вместо пин-кода. Заменить пин-код отпечатком можно на:
смартфонах с Android 6.0 и выше;
iPhone, начиная с модели 5S;
iPad, начиная с модели Air 2.
На смартфонах и планшетах с iOS отпечаток пальца можно обойти, введя пароль устройства. Чтобы защититься от этого, включите мастер-пароль или измените пароль на более сложный: откройте приложение Настройки и выберите пункт Touch ID и код-пароль .
Чтобы включить проверку отпечатка:
Выберите нужный аккаунт.
Включите опцию Отпечаток пальца (для Android) или Touch ID (для iOS).
Мастер-пароль
Чтобы дополнительно защитить ваши одноразовые пароли, создайте мастер-пароль: → Мастер-пароль .
С помощью мастер-пароля вы можете:
сделать так, чтобы вместо отпечатка можно было ввести только мастер-пароль Яндекс.Ключа, а не код блокировки устройства;
сохранить пин-код для Яндекс ID в приложении, чтобы его не приходилось вводить каждый раз, когда вам нужен новый одноразовый пароль.
Резервная копия данных Яндекс.Ключа
Вы можете создать резервную копию Ключа на сервере Яндекса, чтобы иметь возможность перенести ее на другое устройство или восстановить данные, если вы потеряли телефон или планшет.
Чтобы получить данные из резервной копии, нужно:
иметь доступ к номеру телефона, который вы указали при создании копии;
помнить пароль, который вы придумали для шифрования резервной копии.
На сервер копируются данные всех аккаунтов, добавленных в Ключ на момент создания копии. Больше одной резервной копии создать нельзя, каждая следующая копия данных для определенного номера телефона замещает предыдущую.
Внимание. Резервная копия содержит только логины и секреты, необходимые для генерации одноразовых паролей. Пин-код, который вы задали в приложении, когда включали двухфакторную аутентификацию, необходимо помнить.Удалить резервную копию с сервера Яндекса самому пока нельзя. Она удаляется с сервера Яндекса автоматически, если вы не пользуетесь ей больше года.
Создание резервной копии
Выберите пункт Создать резервную копию в настройках приложения.
Введите номер телефона, к которому будет привязана резервная копия (например, «71234567890» ), и нажмите кнопку Далее .
Яндекс отправит код подтверждения на введенный номер телефона. Как только вы получите код, введите его в приложении и нажмите Далее .
Придумайте пароль, которым будет зашифрована резервная копия ваших данных. Этот пароль нельзя восстановить, поэтому убедитесь в том, что вы не забудете или не потеряете его.
Введите придуманный пароль два раза и нажмите кнопку Готово . Яндекс.Ключ зашифрует резервную копию, отправит ее на сервер Яндекса и сообщит об этом.
Восстановление из резервной копии
Выберите пункт Восстановить из резервной копии в настройках приложения.
Введите номер телефона, который вы использовали при создании резервной копии (например, «71234567890» ), и нажмите кнопку Далее .
Если для указанного номера найдена резервная копия данных Ключа, Яндекс отправит код подтверждения на этот номер телефона. Как только вы получите код, введите его в приложении.
Убедитесь, что имя устройства, дата и время создания резервной копии соответствуют той резервной копии, которую вы хотите использовать. Затем нажмите кнопку Восстановить .
Введите пароль, который вы задали при создании резервной копии. Если вы не помните его, к сожалению, расшифровать резервную копию будет невозможно.
Яндекс.Ключ расшифрует данные резервной копии и сообщит о том, что данные восстановлены.
Как одноразовые пароли зависят от точного времени
При генерации одноразовых паролей Яндекс.Ключ учитывает текущее время и часовой пояс, установленные на устройстве. Когда доступно интернет-соединение, Ключ также запрашивает точное время с сервера: если на устройстве время выставлено неверно, приложение сделает поправку на это. Но в некоторых ситуациях даже после поправки и при корректном пин-коде одноразовый пароль будет неправильным.
Если вы уверены, что вводите пин-код и пароль верно, но войти не получается:
Убедитесь, что на вашем устройстве установлено корректное время и часовой пояс. После этого попробуйте войти с новым одноразовым паролем.
Подключите устройство к интернету, чтобы Яндекс.Ключ мог получить точное время самостоятельно. Затем перезапустите приложение и попробуйте ввести новый одноразовый пароль.
Если проблема не разрешилась, обратитесь в службу поддержки через форму ниже.
Если вы включили двухфакторную аутентификацию, вы сможете войти с помощью одноразового пароля на любой сервис или в приложения Яндекса. Если вы добавили несколько аккаунтов в Яндекс.Ключ, перед вводом пин-кода не забудьте переключиться на нужный аккаунт. Еще вы можете войти на некоторые сервисы Яндекса с помощью QR-кода.
Для входа в сторонние приложения и программы (почтовых клиентах, мессенджерах, сборщиках почты и т. п.) используйте пароли приложений.
Внимание. Приложения, разработанные в Яндексе, требуют именно одноразового пароля — даже правильно созданные пароли приложений не подойдут.Вы можете ввести одноразовый пароль при входе на сервисы или в приложения Яндекса.
Примечание. Одноразовый пароль нужно успеть ввести, пока он отображается в приложении. Если до обновления осталось слишком мало времени, просто дождитесь нового пароля.Чтобы получить одноразовый пароль, запустите Яндекс.Ключ и введите пин-код, который вы задали при настройке двухфакторной аутентификации. Приложение начнет генерировать пароли раз в 30 секунд.
Яндекс.Ключ не проверяет введенный вами пин-код и генерирует одноразовые пароли, даже если вы ввели свой пин-код неправильно. В этом случае созданные пароли также будут неверными и войти с их помощью не получится. Чтобы ввести правильный пин-код, достаточно выйти из приложения и запустить его снова.
Некоторые сервисы (например, главная страница Яндекса, Диск и Почта) позволяют войти на Яндекс, просто наведя камеру на QR-код. При этом ваше мобильное устройство должно быть подключено к интернету, чтобы Яндекс.Ключ мог связаться с сервером авторизации.
Чтобы войти с помощью QR-кода:
Нажмите значок QR-кода в браузере.
Если такого значка нет, значит войти на этот сервис можно только с помощью пароля. В этом случае вы можете войти в аккаунт с помощью QR-кода, а затем перейти к нужному сервису.
Войдите в приложение Яндекс.Ключ на вашем устройстве с помощью пин-кода и нажмите Войти по QR-коду . Наведите камеру вашего устройства на QR-код в браузере.Приложения или сайты, которым нужен доступ к вашим данным на Яндексе, иногда требуют ввести пароль, чтобы войти в аккаунт. В таких случаях одноразовые пароли не сработают — для каждого такого приложения необходимо создать отдельный пароль приложения.
Внимание. В приложениях и сервисах Яндекса работают только одноразовые пароли. Даже если вы создадите пароль приложения, например, для Яндекс.Диска, войти с его помощью не получится.Перенос Яндекс.Ключа
Вы можете перенести генерацию одноразовых паролей на другое устройство или настроить Яндекс.Ключ на нескольких смартфонах одновременно. Это можно сделать двумя способами:
Используйте резервную копию данных.
Восстановите данные. Теперь вы можете пользоваться Ключом на новом устройстве так же, как и на старом.Несколько аккаунтов в Яндекс.Ключе
Один и тот же Яндекс.Ключ можно использовать для нескольких аккаунтов с одноразовыми паролями. Чтобы добавить в приложение еще один аккаунт, при настройке одноразовых паролей на шаге 3 нажмите в приложении значок . Кроме того, вы можете добавить в Яндекс.Ключ генерацию паролей для других сервисов, поддерживающих такую двухфакторную аутентификацию. Инструкции для самых популярных сервисов приведены на странице о создании кодов проверки не для Яндекса.
Чтобы удалить привязку аккаунта к Яндекс.Ключу, нажмите и удерживайте соответствующий портрет в приложении, пока справа от него не появится крестик. Когда вы нажмете на крестик, привязка аккаунта к Яндекс.Ключу будет удалена.
Отпечаток пальца вместо пин-кода
Если устройство оснащено сканером отпечатков пальца, отпечаток пальца можно использовать вместо пин-кода. Заменить пин-код отпечатком можно на:
С марта 2019 года для входа на Кинопоиск вам понадобится аккаунт на Яндексе. На этой странице мы ответили на частые вопросы о переходе на один вид авторизации.
Зачем входить с Яндекс ID?
Это удобно: вы можете использовать один аккаунт для быстрого входа на все сервисы Яндекса, смотреть фильмы на Кинопоиске, слушать Яндекс.Музыку и просматривать Яндекс.Почту, не переключая аккаунты.
Это безопасно: вы можете настроить , чтобы защитить ваши данные на Яндексе.
Как зарегистрировать аккаунт c Яндекс ID?
Вы можете зарегистрировать аккаунт по логину или через профиль социальной сети. Вы входите с Яндекс ID — и сразу авторизуетесь на Кинопоиске.
Примечание. При регистрации на Яндексе логин, который вы использовали для входа на Кинопоиск, может быть занят. В таком случае придумайте новый или выберите похожий из списка.У меня есть аккаунт на Кинопоиске без Яндекс ID, как теперь в него войти?
Для входа в прежний аккаунт на Кинопоиске необходимо связать с ним Яндекс ID. Если у вас нет аккаунта на Яндексе, приложение предложит зарегистрировать новый.
У меня уже привязан Яндекс ID, но я не могу войти на Кинопоиск, что делать?
Если вы уже привязали аккаунт на Яндексе, войдите именно с ним. Не используйте прежние способы авторизации (по логину и паролю Кинопоиска или через профиль социальной сети, с помощью которой вы входили в аккаунт на Кинопоиске).
Когда я вошел с Яндекс ID, все оценки, рецензии и покупки пропали. Как все восстановить?
Если вы не привязали аккаунт на Кинопоиске к аккаунту на Яндексе, при регистрации вы получите новый аккаунт. В нем не будет ваших фильмов, оценок и рецензий. Но вы можете перенести в него все данные из прежнего аккаунта.
Как войти в приложение без привязки Яндекс ID?
Начиная с версии приложения 4.6.6 вход возможен только с Яндекс ID.
Как удалить аккаунт на Кинопоиске?
Ваш аккаунт на Кинопоиске теперь превратился в Яндекс ID. Удалить аккаунт на Кинопоиске нельзя, но можно очистить данные аккаунта в настройках на сайте.
Что станет с моими оценками и другими данными после привязки аккаунта к Яндекс ID?
Все данные сохранятся.
Теперь все пользователи увидят мои имя, фамилию и возраст?
Если вы зарегистрировались на Кинопоиске через аккаунт с Яндекс ID, другие пользователи Кинопоиска увидят только ваш логин и фото.
Если вы привязали аккаунт с Яндекс ID к старому аккаунту на Кинопоиске, пользователи увидят все то, что вы указывали, когда регистрировались на Кинопоиске.
Снова читаем документацию и понимаем что нам надо отобразить пользователю веб-страницу, с которой после успешной авторизации произойдет редирект на url со схемой которую мы указали на этапе регистрации.
2) Показываем UIWebView и в его делегатских методах отлавливаем переход по нашей схеме.
Второй подход мне кажется более простым, т.к. во-первых пользователь не покидает наше приложение, а во-вторых авторизация через Яндекс может быть едиственным способом входа в наше приложение.
Пишем код
Создаем тестовый проект в XCode.
Добавляем в проект YandexOauthViewController.* (ссылка на исходный код в конце статьи).
В YandexOauthViewController.h изменяем в следующих строках значения на ваши:
Во ViewController.h импортируем YandexOauthViewController.h и обявляем себя «реализатором» протокола YandexOauthViewControllerDelegate.
@interface ViewController : UIViewController <YandexOauthViewControllerDelegate>
В тестовом приложении будем авторизировать пользвателя при запуске. Для этого во ViewController.m изменяем метод ViewDidLoad:
Какой еще self.navigationController, спросите вы и будете правы — навигейшен контроллера еще нет, поэтому добавляем его в AppDelegate.m:
Запускаем приложение и видим так нужную нам форму авторизации.
Кнопка слева (с крестиком) убирает форму авторизации с экрана, а правая кнопка возвращает пользователя на страницу авторизации. Дело в том, что в некоторых случаях Яндекс теряет цель нашего захода в авторизацию и и отображает профиль пользователя из которого нам токен уже не передадут.
После ввода логина пароля и, в некоторых случаях, подтверждения постоянной авторизации на данном устройстве Яндекс перенаправляет нас по URL-схеме указанной прирегистрации приложения. Рассмотрим перехват этого перехода в файле YandexOauthViewController.m.
Осталось в ViewController.m реализовать протокол YandexOauthViewControllerDelegate.
Читайте также: