company_banner

Опыт Тинькофф Оплаты: улучшили мобильный SDK и сделали оплату в интернете еще удобнее

    image

    Привет! В начале лета мы обновили Tinkoff Acquiring SDK и зарелизили вторую версию для Android и iOS. Tinkoff Acquiring SDK — это open-source-библиотека для мобильных платформ. С ней удобно принимать оплату в приложениях. В статье хочу рассказать, чем это круто для владельцев интернет-бизнеса и их покупателей.

    Что улучшили


    Проблемы, которые были в прошлой версии:

    1. Сложная архитектура библиотеки. Из-за этого разработчики тратили много времени на поиск и исправление ошибок.
    2. Избыточный API библиотеки. Разработчики часто ошибались при интеграции SDK.
    3. Не соблюдаются требования Apple Pay и Google Pay по настройке этих видов оплаты.

    Что мы сделали, чтобы это исправить, и что ещё нового появилось:

    1. Полностью переписали код для обеих операционных систем. Провели рефакторинг кода и добавили много полезных функций. Теперь библиотеки работают на Kotlin и Swift.
    2. Добавили Систему быстрых платежей. Можно платить через СБП по QR-коду или через «Мгновенный счёт» — по кнопке на экране оплаты.
    3. Поддерживаем решение all in one. Всё в одном месте: привязка карт, бесконтактная оплата, быстрые платежи по QR-коду.
    4. Обновили дизайн. Добавили темную тему. Но и не забыли про кастомизацию темы на Android, которая была в прошлой версии.
    5. Продолжаем поддерживать предыдущую версию. Подумали обо всех клиентах, не обделили старых и новых — SDK работает одинаково и в первой, и во второй версии. Но рекомендуем все же обновиться, чтобы пользоваться новыми функциями.

    А теперь обо всем по порядку.

    Для чего нужен Tinkoff Acquiring SDK


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

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

    Вот что умеет SDK:

    Сканировать и распознавать банковские карты с помощью камеры и NFC и сохранять их. Покупатель один раз привязывает карту в приложении, а потом вводит только CVC-код, чтобы оплатить покупки.

    Принимать все виды платежей в приложении: по банковским картам, через личный кабинет tinkoff.ru, Apple Pay и Google Pay. В том числе рекуррентные платежи — то есть автоматические, по подписке, без повторного ввода реквизитов.

    imageimage

    Оплачивать с помощью Системы быстрых платежей (СБП). SDK помогает принимать платежи через СБП: покупатель оплачивает товары по QR-коду, в котором содержится вся информация о заказе. Реализуем два сценария: оплату в клиентском приложении и выставление счёта.

    Поддерживать онлайн-кассу и фискализацию. Всё в соответствии с ФЗ-54.

    Настраивать окно оплаты под дизайн приложения. Доступно в приложениях на Android.

    Архитектурные улучшения


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

    Решение. Разработчики SDK провели полный рефакторинг старого кода библиотек:

    — код написан на современных языках Kotlin и Swift. Это ускорило процесс разработки и помогло выстроить удобную архитектуру, которую легко поддерживать и расширять: мы быстрее внедряем новые функции, а клиенты быстрее получают обновления. В первой версии код написан на Java и Objective-C;

    — на Android настройки экрана созданы с помощью Kotlin DSL. А вся многопоточная работа построена на корутинах: они помогают обрабатывать запросы в сеть, размер библиотеки при этом увеличивается менее чем на 1 МБ;

    — в проекте сократилось количество кода. Используем Generic enum, обработку ошибок с помощью throws и расширения некоторых базовых классов. Поддерживать проект стало проще;

    — обновили API библиотек. Методы вызова экранов и основных функций для оплаты вынесли в отдельный класс. Это единая точка входа библиотеки: гораздо проще вызывать методы API из одного места, чем из раскиданных по коду.

    Структуру методов спроектировали так, чтобы работа с API была удобной и понятной. Методы хорошо задокументированы и соответствуют привычным стандартам кода на Java, Kotlin, Swift.

    Например, так выглядит формирование настроек экрана оплаты и его запуск в SDK Android:

    val tinkoffAcquiring = TinkoffAcquiring("terminalKey", "password", "publicKey")
            val paymentOptions = PaymentOptions()
                    .setOptions {
                        orderOptions {
                            orderId = "777"
                            amount = Money.ofCoins(1000)
                            title = "Order Title"
                            description = "Order Description"
                        }
                        customerOptions {
                            customerKey = "user-key"
                            checkType = CheckType.HOLD.toString()
                            email = "useremail@gmail.com"
                        }
                        featuresOptions {
                            localizationSource = AsdkSource(Language.RU)
                            useSecureKeyboard = true
                        }
                    }
    tinkoffAcquiring.openPaymentScreen(this, paymentOptions, PAYMENT_REQUEST_CODE)
    

    Пример SDK iOS:

    let credentional = AcquiringSdkCredential(terminalKey: "terminalKey", password: "terminalPassword", publicKey: "testPublicKey")
    let acquiringSDKConfiguration = AcquiringSdkConfiguration(credential: credentional)
    
    if let sdk = try? AcquiringUISDK.init(configuration: acquiringSDKConfiguration) {
    	sdk.presentPaymentView(on: self, paymentData: createPaymentData(), configuration: acquiringViewConfiguration()) { [weak self] (response) in
    		self?.responseReviewing(response)
    	}
    }
    

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

    Например, на нашем экране оплаты совершаются два запроса на сервер, а продавцу нужна дополнительная обработка заказа в приложении. Поэтому один из запросов должен выполняться до открытия экрана SDK, а второй — уже на экране. Мы можем такое реализовать.

    Для этого в SDK есть отдельный модуль Core. Он не зависит от платформы разработки, и с помощью него можно вызывать методы Tinkoff Acquiring API. А модуль с UI-частью предлагает другие решения без экрана SDK — дополнительные методы, которые запускают экран оплаты с определенного этапа.

    Google Pay и Apple Pay


    Проблема. Google и Apple требуют, чтобы их способы оплаты находились не рядом с картами на экране оплаты SDK, а как отдельные кнопки в приложении, которые нужно делать самостоятельно. Разработчикам клиента приходится выполнять больше работы по настройке Google Pay и Apple Pay.

    Решение. В обновленном SDK улучшили поддержку приема платежей через Google Pay и Apple Pay.

    Мы учитываем требование Google и Apple, но при этом упрощаем задачу разработчикам. Большую часть настроек оплаты берет на себя SDK, а разработчикам клиента нужно вызвать всего несколько методов.

    Эти методы выполняют:

    • настройку сервисов для платежа Google Pay и Apple Pay;
    • обработку доступности сервисов на девайсе;
    • вызов сервиса для оплаты;
    • обработку результата оплаты.

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

    Система быстрых платежей


    Это новая функция на рынке финтеха и новая технология, поэтому разработчикам пришлось реализовывать ее в SDK с нуля. СБП помогает принимать платежи по QR-коду и моментально зачислять деньги на счет продавца — они приходят сразу же, даже в выходные и праздники.

    Как это работает:

    1. При оплате заказа покупатель нажимает «Оплатить через СБП».
    2. Покупатель попадает в банковское приложение и там подтверждает списание денег. Сумма будет указана в платежной форме.
    3. После оплаты деньги сразу приходят на расчетный счет продавца.

    imageimage

    Подключить новый способ оплаты клиенты могут в личном кабинете Тинькофф Оплаты. После этого в мобильном SDK у клиентов откроется возможность принимать платежи через СБП — по кнопке и QR-коду.

    «Мгновенный счёт». На экране оплаты появляется кнопка с логотипом СБП.

    Настройка экрана fpsEnabled включает кнопку для быстрой оплаты в Android SDK:

    var paymentOptions = PaymentOptions().setOptions {
        orderOptions { /*options*/ }
        customerOptions { /*options*/ }
        featuresOptions {
            fpsEnabled = true         
        }
    }
    

    В iOS SDK нужно передать buttonPaySPB:

    let viewConfigration = AcquiringViewConfigration.init()
    viewConfigration.fields = []
    viewConfigration.fields.append(AcquiringViewConfigration.InfoFields.buttonPaySPB)
    

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

    Для экрана оплаты по QR-коду в SDK есть соответствующий метод. Разработчику приложения нужно создать кнопку в разметке и вызвать метод.

    На Android:

    tinkoffAcquiring.openStaticQrScreen(context, screenOptions, STATIC_QR_REQUEST_CODE)

    Метод на iOS:

    sdk.presentPaymentSbpQrImage(on: self, paymentData: createPaymentData(), configuration: acquiringViewConfiguration()) { [weak self] (response) in
    			self?.responseReviewing(response)
    		}

    Обновленный дизайн и темная тема


    Было:
    imageimage

    Стало:
    imageimage

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

    Еще экраны SDK теперь поддерживают горизонтальную ориентацию девайса и темную тему. Чтобы поддерживать настройки клиентского приложения, в Android SDK режим темной темы можно указать в настройках экранов. Возможные значения: «Всегда включена», «Всегда выключена», «Переключение в зависимости от настроек девайса или режима экономии заряда батареи». В iOS SDK темная тема переключается в зависимости от настроек самого приложения.

    Локализация экранов


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

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

    Как начать пользоваться


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

    Методы подключения библиотек, документацию и исходный код смотрите на нашем GitHub:

    Android SDK

    iOS SDK

    Если есть любые вопросы по библиотеке или нужна помощь с переходом на новую версию, напишите нам, поможем разобраться: oplata@tinkoff.ru. Или создайте Issue в соответствующем разделе на GitHub.
    Tinkoff
    it’s Tinkoff — просто о сложном

    Похожие публикации

    Комментарии 17

      +2

      … одной рукой лечит, другой калечит.


      Вы уже месяц сломали пополнение в валюте через unistream, а саппорт просит показать, какая там ошибка (как будто пользователям дают смотреть в мониторы операционисток).

        0
        В декабре интегрировали SDK в приложение. Выяснилось, что вообще вся логика по отправки чеков, все платежные данные, tokenы необходимо передавать в приложение и от туда оно отправляется на ваш сервер напрямую. Никакой промежуточной обработки данных на нашем сервере. В итоге любое изменение бизнес логики или законодательства потребвоало бы выпускать новую версию. Это все еще так?
          0
          У нас есть некоторые расширения логики в новой версии, например можно инициировать платеж в приложении, выполнить дополнительную обработку на вашем сервере и уже после открыть экран sdk с переданным paymentId, для ввода карточных данных пользователем и подтверждения платежа. В общем случае, логика обработки платежей происходит на наших серверах и изменения в законодательстве сразу же будут учтены. Если у вас есть вопросы по конкретным кейсам, напишите нам на почту oplata@tinkoff.ru, поможем разобраться.
            0
            Пример: появилось новое обязательное поле в чеке. Или сменился тип юрлица. И это сломает все, потому что вместо «тонкого» клиента, вы сделали «толстого» со всей логикой внутри. Это просто не подходит. Мало того, надо еще делать собственное шифрование, чтобы получить все данные о юрлице, токенах с сервера в приложение. Надеюсь вы учтете это в следующей версии.
          0
          Почему тинькофф не сделает встраиваемые поля в дизайн сайта продавца?
          Через iframe можно все сделать безопасно и удобно для продавца.
            0
              0
              Передала ваш вопрос коллегам, я напишу, когда получу ответ
                0
                Сейчас для интеграции у нас существует платежный виджет.
                С технической стороны мы предоставляем готовый код, который необходимо прописать на сайте для кнопки «оплатить», который вызывает платежную форму.

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

                  При этом с точки зрения стандарта безопасности PCI DSS все остается на высоком уровне — каждое поле для данных карты грузится как отдельный прозрачный iframe с защищенного сервера банка, а поля можно стилизовать в рамках параметров API.

                  Клиент при этом доволен улучшенной платежной конверсией и нет головной боли с PCI DSS в отличии от скрипта Checkout от cloudpayments (дочерняя компания tinkoff), где клиенту нужно постоянно сканировать свой сервер на уязвимости и заниматься процедурами для соответствия PCI DSS. Порог вхождения для клиента за счет упрощения сложностей с PCI DSS намного сокращается.

                  Почему на западе такое есть — а в России только одну компанию нашел.

                  Спросите пожалуйста у колег еще раз — когда сделаете такое?
              0
              А эту проблему когда полечите?
              github.com/TinkoffCreditSystems/AcquiringSdkAndroid/issues/14

              Мы пока используем веб версию на мобилках и ждем…
                0
                По поводу организации безопасной передачи данных терминала в клиентском приложении были переданы рекомендации в саппорт. Точно не знаю, это вы обращались или нет. А по поводу проксирования — коллегам с бэка была передана задача, они занимаются
                  0
                  Да, это был я. Спасибо, что рассматриваете эту проблему. Ждём решения
                0
                Покупатель попадает в банковское приложение и там подтверждает списание денег. Сумма будет указана в платежной форме.

                можно подробнее о там как это работает для покупателя?


                какие банки? (со сбера можно платить?)
                оплата проходит со счёта, а не с карты? (никакого КБ, со счёта кредитной карты будет с комиссией/не в грейс?)

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

                    это вы сейчас именно за ТКС говорите? или так во всех банках, это требование ЦБ?

                      0
                      Про Тинькофф, да
                  +1
                  Последние несколько месяцев занимаемся разработкой мобильного приложения. Исходно стартовали с эквайрингом от Яндекс.Кассы. Там, в принципе, все шло ровно. Но тут нежданно-негаданно грянул Сбер со своим ребрендингом в Ю-Кассу. Из-за этого резко понадобилось переоформлять личный кабинет, а вместе с ним и договор. Сервис полетел в ад. Менеджеры менялись один за другим. Мы решили глянуь по сторонам. Увидели CloudPayments, но у них какой-то дикий тариф + крайне заносчивая поддержка в стиле «мы предоставляем безумно крутой сервис, поэтому не будем с вами обсуждать ничего». Наконец добрались до Тинькофф. Подумали, что ну тут-то будет супер. Это ж Тинькофф. Лучший онлайн-банк в Галактике. Плюсом шло то, что это банк, а нам по природе сервиса предстояли агентские отношения. Поэтому перспектива держать расчетные счета там же, где эквайринг, добавляла +100500 к простоте проверок по 115-ФЗ. Зарегистрировались, создали ЛК, начали ковырять.

                  1. Базовые функции, реализованные в SDK (например, получение списка карт) не работают из коробки. Падает с парсингом ответа с сервера. В приложении, которое поставляется как пример, реализован костыль, который эту проблему фиксит. Его надо копировать к себе в апп.

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

                  3. Для работы с экварингом создается Магазин. Вместе с ним идут два терминала: Тестовый и Боевой. Для тестового в ЛК есть сценарий проверки интеграции, который состоит из кейсов, вроде «проведите платеж, потом отмените». Мы прошли все кейсы. Боевой терминал не активировался (в ЛК написано, что должен). Постучались в поддержку. Там сказали, что у нас сайт не работает. Мы ответили, что мы делаем мобильное приложение. Его нужно опубликовать в стор, для этого необходимо проверить работу эквайринга. В частности, мы должны протестировать повторные платежи (рекурентные). Можно ли это сделать с тестовым терминалом? Нет, он не дает провести любые операции, отличные от тех, что есть в сценарии активации. Есть ли тестовые карты (а-ля всем известные 4242 4242...)? Нет, такой функционал не предусмотрен. Есть ли тестовый магазин? Нет. Но вы можете проводить для тестирования реальные операци по реальным картам, но для этого нужен боевой терминал, а его мы вам не активируем. За три дня переписки с поддержкой мы так и не поняли, как нам выложить приложение с эквайрингом Тинькофф в AppStore, если мы ничего не можем проверить.

                  4. Какой-либо SDK для веба не предусмотрен в принципе. Есть некий виджет, из документации к которому «киньте вот эту форму на страницу и загрузите вот этот скрипт».

                  5. Документация для хуков, которые прилетают от сервера на те или иные события, отсутствует.

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

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

                  Разработчикам: если вам нужно быстро и без головной боли сделать эквайринг, пока что соваться в Тинькофф бессмысленно. Тестирование там не работает в принципе, оно не продумано. Документация на уровне перечисления методов в API, а SDK наровит рассыпаться на каждом шагу.

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

                  Самое читаемое