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

С апреля 2020 года все приложения, использующие стороннюю службу или службу входа в социальные сети, должны предлагать вход через Apple, если они хотят, чтобы их приняли в App Store.

В этом руководстве мы рассмотрим шаги по добавлению Войти через Apple в этот клон iMessage.

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

Что делать с Apple?

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

- Портал разработчиков Apple: вход через Apple

Что вам нужно

1. Настройка клиентского проекта

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

Теперь вам нужно добавить возможность входа в систему с помощью Apple на вкладке «Подписание и возможности» вашей цели.

2. Добавление кнопки входа

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

Нам также нужно добавить экран аутентификации, который появится перед экраном контактов. Давайте создадим AuthenticationViewController.swift файл и вставим следующий код:

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

Теперь запустите проект, и у вас должна быть кнопка, при нажатии которой открывается экран контактов.

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

3. Настройка серверной части

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

Короче говоря, мы создадим простую серверную часть Node.js / Express с одной конечной точкой: /authenticate. Мы также будем использовать пакет node-persist для сохранения новых пользовательских данных при первой аутентификации. Если вы не заинтересованы в самостоятельной сборке серверной части или у вас возникли проблемы, вы можете получить полный код в репозитории.

В терминале выполните следующие команды:

Следующие ниже фрагменты кода можно последовательно скопировать в файл index.js.

Начнем кодирование нашего index.js с импорта необходимых нам объектов:

Теперь настройте клиент Stream Chat с учетными данными, которые вы получаете на панели управления Stream:

Настройте клиент Apple Auth:

Подробнее о заполнении этих параметров читайте в файле SETUP.md apple-auth.

Если вы используете что-то другое, кроме Node.js для своей серверной части, существуют версии этой библиотеки для других языков, например Go. Если вы не можете найти его для предпочитаемого вами внутреннего стека, вам придется прочитать исходный код apple-auth и Войти с помощью спецификаций Apple API, чтобы реализовать нечто подобное с нуля.

Инициализируйте Express и node-persist хранилище:

Теперь приступим к созданию обработчика для /authenticate конечной точки, извлекая необходимые нам параметры из запроса:

Теперь мы проверяем appleAuthCode на серверах Apple с помощью apple-auth и извлекаем адрес электронной почты пользователя из ответа:

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

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

Теперь давайте закончим обработчик, получив пользовательские данные из локального хранилища и передав их в ответ:

Наконец, давайте настроим приложение Express для прослушивания порта 4000:

Теперь мы можем закрыть index.js и оставить серверную часть работающей с помощью следующей команды:

Если это работает, при открытии localhost:4000/authenticate в вашем браузере будет отображаться Cannot GET /authenticate, и это нормально, потому что мы будем использовать POST в клиентском приложении.

4. Запросить авторизацию с помощью Apple ID.

Вернемся к Xcode.

Во-первых, нам нужно закодировать функцию для взаимодействия с только что созданной конечной точкой /authenticate. Давайте создадим файл с именем Authentication.swift и начнем с определения структур запроса и ответа.

Благодаря Codable мы можем легко преобразовать эти объекты в JSON и из него, что очень удобно, поскольку мы определяем фактическую функцию для взаимодействия с /authenticate, отправляя AuthRequest и получая AuthResponse:

Напоминание: Войти через Apple можно только на реальном устройстве. Обязательно замените [your local ip] IP-адресом локальной сети вашего Mac, а не localhost или 127.0.0.1. Чтобы узнать это, выполните следующую команду в терминале Mac:

Теперь, чтобы аутентифицировать пользователя в Apple, вернемся к AuthViewController.swift и отредактируем обработчик нажатия кнопки, чтобы добавить следующее поведение:

Эта реализация заставит нажатие кнопки «Войти с помощью Apple» запускать экран «Вход с помощью Apple».

Однако он еще не скомпилирован, потому что мы не выполнили AuthViewController пару обязательных протоколов.

Нам нужно согласовать AuthViewController с ASAuthorizationControllerPresentationContextProviding, чтобы сообщить Войти через Apple, в каком окне отображать поток:

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

Наконец, у нас есть работающая реализация входа с помощью Apple:

Поскольку это новый пользователь, у нас не отображаются контакты.

Внутренние журналы должны выглядеть примерно так:

Заключение

Поздравляю! Теперь вы можете встроить вход с аутентификацией Apple в любое приложение iOS. Обязательно прочтите Правила и документация для входа в систему Apple, чтобы быть в курсе требований и объявлений.

Спасибо за чтение и удачного кодирования!