Быстрая авторизация с автозаполнением паролей в iOS 11

Russian (Pусский) translation by Ellen Nelson (you can also view the original English article)

Final product image — What You'll Be Creating

Автозаполнение паролей в iOS 11

Вход в аккаунт это первое, что должен сделать пользователь, при запуске приложения, которое требует наличие аккаунта пользователя. Обычно это занимает несколько секунд, если пользователь помнит данные для входа и может быстро и правильно ввести их с одной попытки. Другие пользователи предпочитают переключиться на службу паролей (iCloud Keychain, 1Password, LastPass, и т.д.), чтобы скопировать их имя пользователи и пароль. Излишне говорить, что такие манипуляции приостанавливают пользователей, а некоторые из них просто сдадутся на этом этапе.

Были некоторые попытки улучшить этот процесс. Например, 1Password, предлагает хорошее дополнение, с помощью которого разработчики приложений решить эту проблему. Другое решение уже включено в iOS начиная с WWDC 2014 — Safari Shared Credentials.

Хотя, в iOS, Apple анонсировала более простой вариант осуществления процесса входа: новый Password AutoFill API. В сравнении с предыдущим решением, это проще в использовании для конечного пользователя и быстрее осуществимо для разработчиков.

Из этой статьи вы узнаете, как ускорить процесс входа и улучшить удержание пользователь с новым API, анонсированным в iOS 11 — Password AutoFill.

Введение

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

Для внедрения Password AutoFill в ваше приложение, нужно выполнить эти два шага:

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

Панель QuickType

Для начала сделаем отображение на панели QuickType кнопку с ключом. Затем, пользователи нажимают это и выбирают данные для входа, предоставленные контроллером вида. Свойство, необходимое для появления панели QuickType это свойство textContent в вашем объекте UITextField или UITextView. Если у вас свой контроллер, который выполняет функцию <UITextInput>, то можете применить этот же код.

Вы должны добавить это свойство к полям email/имя-пользователя и пароль. Общая реализация будет такой:

usernameTextField.textContentType = .username
passwordTextField.textContentType = .password

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

The QuickType bar with the simple key icon

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

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

Подсказки данных для входа

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

Если вы уже используете Universal Links ваше приложение должно показать данные для входа для вашего сайта на панели QuickType. iOS знает какой веб-сайт относится к вашему приложению, так что оно на 100% готово показать данные для входа.

Другой способ для связки вашего приложения и сайта, без необходимости в Universal Links, это веб данные связанные с доменом.

Переключите параметры вашего проекта Xcode, перейдите на вкладку Capabilities и включите Associated Domains. Добавьте туда URL вашего сайта. Для доменного имени сайта amazingwebsite.com: вы должны указать webcredentials:amazingwebsite.com.

Xcode Capabilities section with Associated Domains turned on

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

Создайте новый текстовый файл (вне вашего проекта Xcode, если хотите) и назовите его apple-app-site-association. Это стандартное название, которое iOS будет искать на нашем сервере, используя безопасное подключение (на вашем сервере должен быть настроен SSL). Содержимое этого файла тоже довольно стандартное. Просто скопировать эти вставьте следующий код.

{
    "webcredentials" : {
        "apps" : ["1EMDW8DVTP.com.patrickbalestra.AutoFill"]
    }
}

Вам надо изменить Team ID в строке с apps на ваш (вы можете найти его на портале разработчиков в разделе членства), он начинается с точки и идентификатора вашего приложения (bundle identifier). Создайте папку под названием .well-known в корневом каталоге вашего сервера и загрузите туда файл.

Чтобы убедиться, что все прошло как задумано, проверьте наличие файла по указанному адресу через веб-браузер: https://patrickbalestra.com/.well-known/apple-app-site-association.

Если JSON-файл отображается правильно, как на изображении ниже, тогда всё готово.

Запустите приложение и увидите, что панель QuickType предлагает данные для входа на ваш веб-сайт, так что теперь вы можете войти в одно касание.

Credentials suggestion in the QuickType bar

Если вы хотите узнать больше о Password AutoFill, загляните в Session 206 at WWDC 2017.

Вывод

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

Оставайтесь на связи и следите за новыми руководствами о новом iOS 11 API, а пока, посмотрите наши другие статьи о разработке приложений на iOS.