Как подружить Flutter и Huawei — настраиваем App Gallery. Часть 1

В жизни каждого мобильного разработчика настает момент, когда пора выкладывать приложение в альтернативные сторы. 

Обычно готовить приложение к публикации в таких сторах особо не нужно, но есть исключение — App Gallery.

Меня зовут Самир, я Flutter-разработчик в Surf, и сегодня я расскажу, как всё-таки подружить Huawei и Flutter.

О чем статья

В этой части статьи мы узнаем:

• почему Huawei надо отдельно поддерживать;

• что такое mobile или media-сервисы;

• какие решения Huawei выпустили для Flutter;

• как настроить приложение в консоли разработчика App Gallery.

Предыстория

Раньше деревья были большими, всё было просто и прекрасно.

Были 2 платформы — Android и iOS, и у каждого по одному основному стору. Были альтернативные, но острой необходимости использовать их не было.

Huawei штамповал телефоны, пользуясь всеми благами Google — ставил Android, Play Market — и не имел проблем.

Но в 2019 году у Huawei отрезали доступ к американской продукции — это означало не только запрет на использование Play Market и Android, но и идущих с ними рука об руку Google-сервисов.

Пришлось выкручиваться — сразу после введения санкций анонсировали Harmony OS. Это их собственная операционная система на базе Android Open Source Project. Годом раньше на международный рынок запустили App Gallery. Так вместо Googlе-сервисов (GMS) пришли Huawei Media-сервисы (HMS).

Mobile-сервисы, и почему они важны

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

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

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

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

Разумеется, вес приложения от этого вырастет. 

А если вы попробуете отправить в Google Play APK с SDK оплаты Huawei, то он не примет сборку. Так что тут рекомендуем всё-таки разделять сборки для сервисов.

Flutter для Huawei

На pub.dev у команды HMS Core есть авторизованный аккаунт паблишера. В нём они выкатывают пакеты, которые используют HMS для доступа к данным устройства и пользователя. 

Там — весь перечень пакетов: от привычных нам пуш-уведомлений, геолокации и аналитики до диковинных штук — карт, входа в аккаунты Huawei, рекламы, сервиса игр. Есть даже 4 с лишним пакета с функционалом машинного обучения — распознавания текста, языка. В общем, text-to-speech. 

App Gallery

Вот мы и подошли к самому интересному — конфигурации проекта под Huawei. Разберёмся с App Gallery.

Регистрация и команда

Для начала регистрируемся и создаём аккаунт Huawei Developer. 

Дальше всё может пойти по двум сценариям:

1. Подключаемся к команде заказчика. 

На его стороне прошла регистрация. Нам остаётся только работать в его среде. 

Некоторые шаги из статьи можно пропустить, если они уже настроены заказчиком.

2. Создаём собственный проект

Для этого нужно подтвердить аккаунт — заполнить специальную форму. 

Прикладываем скан паспорта, фотографию банковской карты, адрес, номер телефона и другие личные данные. 

Затем заявка должна пройти модерацию от команды Huawei Developers — наша обрабатывалась почти неделю.

Создание проекта

Для начала внутри команды нужно создать проект (если проект уже создан заказчиком, пропустите эти шаги).

Заходим во вкладку «Мои API», и там ищем большую кнопку создания проекта. Смело на неё жмём:

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

Включение API для проекта — Huawei Developer

Теперь нужно включить API, которые мы будем использовать в приложении. Самое время перейти во вкладку «Библиотека API».

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

Выбираем API, которое будем использовать для проекта. У нас это Push Kit и Location Kit.

На странице нужного нам API нажимаем кнопку «Включить» и подтверждаем пользовательское соглашение, если требуется.

Тут мы закончили, пора переходить в App Gallery Connect. 

Важные моменты:

• App Gallery — магазин приложения;

• Huawei Developer — консоль разработчика. В ней мы управляем своими данными, видим свои проекты, счета на оплату, коммуникации с поддержкой и прочее;

• App Gallery Connect — консоль магазина приложений. Тут мы управляем публикацией, настройкой API, видим отзывы на приложение, аналитику пользовательских действий и другое.

Посмотреть App Gallery Connect можно через вкладку «Службы приложения».

Создание приложения

При первом открытии оказываемся на главной странице App Gallery Connect. 

Переходим во вкладку «Мои приложения» — она находится в верхней части сайта:

И встречаем пустой список. На нём нажимаем «Создать приложение»:

Дальше — заполняем данные приложения. Делаем это по аналогии с другими магазинами приложений, тут не задерживаемся.

Как только мы создали приложение для проекта, можем зайти в настройки проекта в AppGallery Connect. Для этого заходим в «Мои проекты»:

После — выбираем созданный проект:

При переходе получаем диалоговое окно, в котором нам предлагают ввести Bundle ID приложения. Вводим его для production-версии.

Ура, вот мы и создали приложение! Рекомендуем ещё создать отдельное приложение для debug-версий, чтобы у него тоже был доступ к API Huawei.

Создание приложения — версия для debug

Делаем это прямо из настроек проекта — нажимаем «Добавить приложение»:

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

Включение API для проекта — App Gallery Connect

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

Чтобы включить API, в настройках проекта заходим в «Управление API».  Здесь, помимо API, которые мы видели на сайте Huawei Developer, будет несколько новых. Например, аналитика пользовательских действий. 

Ищем нужные API, нажимаем на свитчер, соглашаемся со всем и включаем.

Добавление отпечатка сертификата

Теперь добавляем отпечаток сертификата SHA-256.

Для этого возвращаемся во вкладку «Основная информация» и скроллим до секции «Данные приложения».

Забавно: до недавнего времени кнопка «?» вела на документацию. Сейчас — ведёт на ошибку 404. 

Проблема с исчезновением документации — частая история у Huawei. Например, за одну неделю работы с App Gallery, когда мы открывали документацию по использованию определённого API, гиперссылки переставали работать один за другим.

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

Открываем Android Studio.

В окне создания билда в форме выбора сертификата нажимаем “Create new…”:

Вводим валидные данные для сертификата, запоминаем оба пароля и название сертификата, и сохраняем в расширении .jks. Сохранить лучше в проекте, потому что этот сертификат нам ещё понадобится для сборки и отладки приложения.

Дальше нам будет нужна Java на устройстве, поскольку нам понадобится keytool.

Вводим команду, где вставляем название сертификата и оба пароля, и получаем ключ SHA-256.

Идем с SHA ключом обратно в App Gallery Connect и вставляем ключ в поле ввода.

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

Осталось скачать файл agconnect-services.json и вернуться в Android Studio.

Вот мы и настроили наше приложение в App Gallery Connect! 

В следующей части расскажем, как правильно сконфигурировать Flutter-проект.

Больше полезного про Flutter — в Telegram-канале Surf Flutter Team. 

Кейсы, лучшие практики, новости и вакансии в команду Flutter Surf в одном месте. Присоединяйтесь!