Настройки разработчика вконтакте android

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

Поддерживаются версии Android 5.0 и выше.

Для получения отпечатка Вашего сертификата можно воспользоваться одним из следующих способов.

/.android/ для OS X и Linux,

C:\Documents and Settings\ \.android\ для Windows XP,

C:\Users\ \.android\ для Windows Vista, Windows 7 и Windows 8.

Хранилище для release версии обычно создаётся разработчиком, поэтому вы должны сами создать или вспомнить его расположение.
2) После того, как Вы определили местоположение Вашего хранилища, используйте утилиту keytool (поставляемую совместно с Java SDK). Получите список ключей следующей командой:

keytool -exportcert -alias androiddebugkey -keystore path-to-debug-or-production-keystore -list -v

Certificate fingerprint: SHA1: DA:39:A3:EE:5E:6B:4B:0D:32:55:BF:EF:95:60:18:90:AF:D8:07:09

Удалив все двоеточия, Вы получите отпечаток своего ключа.

String[] fingerprints = VKUtils.getCertificateFingerprint(this, this.getPackageName());

Как правило, fingerprints содержит одну строку, которая будет отпечатком Вашего сертификата (в зависимости от того, каким сертификатом было подписано приложение).

В настройках приложения можно добавить несколько отпечатков, например, debug и release.

Вы можете добавить следующие зависимости в ваш файл project/build.gradle:

android-sdk-core: базовая функциональность (обязательно).
android-sdk-api: сгенерированные модели и методы.
androidsdk: устаревшая копия android-sdk-core (будет удалена).
androidsdkapi: устаревшая копия android-sdk-api (будет удалена).

К примеру, Ваш скрипт app/build.gradle будет содержать следующие зависимости:

dependencies <
implementation ‘com.vk:android-sdk-core:3.x.x
implementation ‘com.vk:android-sdk-api:3.x.x
>

Старые версии SDK вы можете найти здесь

Если у пользователя установлено приложение ВКонтакте, то авторизация пройдет через него без ввода логина и пароля.

Используйте метод VK.login

VK.login(activity, arrayListOf(VKScope.WALL, VKScope.PHOTOS))

Для доступа к API можно использовать как встроенные в SDK методы, так и получив access_token использовать свою библиотеку.

Выполняйте запросы с VK.execute

VKUsersCommand поддерживает деление на части для работы с лимитами API. В этом основное отличие VKUsersRequest от VKUsersCommand.

Также вы можете проверить VKWallPostCommand. Это пример сложного API-запроса с загрузкой файла.

Источник

Настройки разработчика вконтакте android

VK Mini Apps — это платформа встраиваемых кроссплатформенных приложений ВКонтакте. Они создаются на базе стандартных веб-технологий: HTML, JavaScript, CSS.

В этом разделе вы найдёте инструкции для разработчиков мини-приложений.

В разделе Развивайте бизнес с мини‑приложениями ВКонтакте вы можете:

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

Как создать мини-приложение на платформе VK Mini Apps, в двух видеоуроках.

Часть 1. Первые шаги	Часть 2. Лайвкодинг

Набор для создания приложения на платформе VK Mini Apps включает следующие npm-библиотеки:

https://www.npmjs.com/package/@vkontakte/vk-bridge — VK Bridge для взаимодействия с официальным приложением ВКонтакте;
https://www.npmjs.com/package/@vkontakte/vkui — VKUI, компоненты интерфейса;
https://www.npmjs.com/package/@vkontakte/icons — VK Icons, SVG-иконки на все случаи жизни.

Важно! Библиотеку VK Bridge необходимо использовать при разработке любого приложения. Остальные библиотеки — не обязательно.

В первую очередь стоит изучить следующие разделы.

Библиотека для создания шаблонного мини-приложения.
Справочник «События VK Bridge».
Если вы ещё не работали с React, рекомендуем прочитать официальное руководство.
Если вы уже начали разработку, ознакомьтесь со списком рекомендаций для тех мини-приложений, которые мы размещаем в каталогах.

Создайте приложение на этой странице: https://vk.com/apps?act=manage.

Выберите «Встраиваемое приложение», тип: «VK Mini App», укажите название и подтвердите действие. Вы попадёте в интерфейс администрирования Вашего приложения.
Перейдите на вкладку «Настройки» и заполните поля «Мобильная версия»/«Полная версия», указав ссылку на адрес приложения — URL страницы на вашем сайте, которая будет отображаться в браузере в официальных мобильных клиентах и внутри фрейма в веб-версии ВКонтакте.
В конце URL укажите слэш, если ссылаетесь на папку, иначе мини-приложение может открыться в браузере вместо мобильного приложения.

Если какую-то из версий, полную или мобильную, вы не планируете реализовывать — оставьте соответствующее поле пустым.

Библиотека для создания шаблона мини-приложения полезна для учебных целей:

https://www.npmjs.com/package/@vkontakte/create-vk-mini-app.

Мы рекомендуем именно этот способ для начала работы с VK Mini Apps.

Чтобы создать шаблон приложения, выполните команду:

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

Если вы используете библиотеку для создания шаблона, отдельно подключать VKUI не нужно.

Для подключения вручную:

Создайте новое приложение:

npm install @vkontakte/vkui || yarn add @vkontakte/vkui

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

использовать компонент PanelHeader на каждом экране приложения. Он должен содержать название приложения и иконку «Назад» на тех экранах, где она требуется.

не занимать правый верхний угол PanelHeader — это место зарезервировано для нативного бара с кнопками «Меню» и «Закрыть», который отображается всегда.

использовать стилизованную под платформу иконку «Назад». Для этого используйте компонент

На устройствах с Android нажатие кнопки «Назад» вызывает в вебвью событие history.back (см. документацию). По нажатию этой кнопки официальное приложение сделает возврат на предыдущую страницу вашего приложения или закроет его, если вернуться невозможно. Поэтому для корректной навигации необходимо обрабатывать нажатие аппаратной клавиши в мини-приложении и реализовывать роутинг, например, при помощи библиотеки react-router.

Чтобы мини-приложение могло использовать API ВКонтакте и API устройства пользователя, необходимо подключить библиотеку VK Bridge, которая служит для отправки и получения событий.

В справочнике VK Bridge есть список всех событий, которые можно использовать. Обратите внимание на то, что в коде приложения обязательно нужно вызывать событие инициализации VKWebAppInit, иначе приложение не запустится.

Если ранее вы не работали с API ВКонтакте, рекомендуем прочитать это руководство.
Если ранее вы не работали с React, рекомендуем прочитать это руководство.

vk-bridge — это NPM-пакет для отправки и получения событий в вашем
приложении.

Если вы используете библиотеку для создания шаблона, отдельно подключать VK Bridge не нужно.

Для подключения вручную используйте эту инструкцию.

Установите пакет:

npm install @vkontakte/vk-bridge || yarn add @vkontakte/vk-bridge

Источник

Разработка приложений в VK mini apps

Почему надо смотреть в сторону разработки приложений для работы в VK? У меня за спиной много лет фронтенд-разработки для массовых сервисов, и то, что сейчас предлагает разработчику социальная сеть «ВКонтакте» — быстрый и эффективный способ построить еще один канал коммуникации с действительно большой аудиторией. Ниже расскажу, в чем идея VK mini apps, какие технологии использовать при разработке приложения и на что стоит обратить внимание.

Платформа VK mini apps

«ВКонтакте» предоставляет сторонним разработчикам возможность писать веб-приложения и размещать их в каталоге приложений и/или продвигать внутри сети. Пользователям приложений не нужно скачивать отдельные нативные приложения из Google Play/App Store, функционал выбранного приложения доступен внутри пользовательской сессии основного приложения во «ВКонтакте» или через браузер, на сайте соцсети. В социальной сети есть подробная инструкция о том, как начать работу на платформе VK mini apps.

Инфраструктура приложения VK mini app

Приложение VK mini app представляет собой обычный веб-ресурс, располагаемый по определенному адресу. Его мы должны разместить в «Панели управления приложением» социальной сети.

«ВКонтакте» позволяет разместить три версии приложения:

для мобильных клиентов — то есть для открытия в нативном приложении «ВКонтакте»;
десктопный вариант — vk.com в браузере;
вариант для браузеров в мобильных телефонах (https://m.vk.com).

При размещении вы также можете включить «Режим разработки». Он позволяет пользователям «ВКонтакте», назначенным в качестве администраторов приложения, использовать для тестирования каждой из трех витрин отдельный адрес. То есть открывая приложение, обычный пользователь увидит то, что расположено по условном адресу yourapp.com, а администратор — test.yourapp.com.

Ваш веб-ресурс встраивается в приложение «ВКонтакте» через обычное WebView, при открытии с десктопа — через iFrame. Поэтому необходимо держать в уме, что часть функционала JavaScript может быть недоступна, необходимо тщательное тестирование.

После тестирования веб-приложения на разных устройствах его можно отправлять на модерацию, чтобы оно могло быть размещено в каталоге. Заявка на модерацию отправляется из «Панели управления приложением». Объявленный «ВКонтакте» срок модерации — 7 дней. Выкладки новых приложений (сервисов по терминологии «ВКонтакте») происходят раз в неделю по четвергам.

Есть подробная памятка о том, как создать правильное приложение. Рекомендую внимательно свериться с ней, прежде чем отдавать приложение на модерацию.

Разработка приложения VK mini app

Итак, приложение VK Mini Apps — это, по сути, обычное веб-приложение, которое встраивается в платформу посредством iFrame или WebView. Поэтому выбор технологий, на котором оно будет написано, за вами.

Однако для разработки фронтенда «ВКонтакте» рекомендует собственную библиотеку готовых компонентов VK UI, выполненную на React:

Это удобно — многие типовые компоненты уже готовы, осталось только встроить их в структуру вашей страницы или SPA.

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

«ВКонтакте» не требует от разработчика следования какой бы то ни было жесткой архитектуре построения фронтенда — мы берем только то, что нужно, и модифицируем компоненты так, как нужно. Например, вы всегда сможете добавить глупому view-компоненту свой класс, свой обработчик событий, сделать вложенные компоненты любой глубины и так далее.
Существует достаточно подробная (правда, не совсем полная) документация по VKUI. Исходный код на GitHub: https://github.com/VKCOM/VKUI. Соответственно, максимально простая установка:

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

Далее нам нужно просто встроить React-приложение на страницу.

Параметры открытия приложения

«ВКонтакте» сам добавляет параметры запуска к адресной строке, по которой открывается ваше приложение. Их список следующий: vk_user_id, vk_app_id, vk_are_notifications_enabled, vk_language, vk_ref, vk_access_token_settings, vk_group_id, vk_viewer_group_role, vk_platform, vk_is_favorite, sign. То есть фрейм с вашим приложением откроется примерно с похожим адресом: youvkapp.ru/?vk_access_token_settings=notify&vk_app_id=888888&vk_are_notifications_enabled=1&vk_is_app_user=1&vk_is_favorite=1&vk_language=ru&vk_platform=desktop_web&vk_ref=other&vk_user_id=111111&sign=fsdfsdgfgfiuoitu8345u34j

Это позволяет уже при старте приложения иметь достаточно полный набор данных, извлеченных из url, чтобы начать персональное взаимодействие с конкретным пользователем. Например, говорить с ним на одном языке — русском, английском или каком-то другом, либо попросить о включении своих уведомлений.

Дополнительные параметры в этот список «ВКонтакте» на ноябрь 2019 года включать не планирует. Однако в url можно передать произвольный хэш, например: youvkapp.ru#custom_param

Роутинг

Если в приложении больше одного экрана (я думаю, это как раз ваш случай), нужен переход между экранами. За показ того или иного экрана отвечает state нашего React-приложения. Что касается организации View, то «ВКонтакте» предлагает два способа: смена активного компонента VKUI View и VKUI Panel.

Каждый View отвечает за свой пользовательский сценарий: основной, дополнительный, вызов справочников, страницы поиска и другие. Внутри View содержится свой набор Panel — это конкретные шаги (экраны) в пользовательском сценарии. Абстрактно это выглядит так:

В state в activePanel мы прописываем id того элемента, который нужно показать.

Верстка и компоненты

Теперь можно посмотреть типичную страницу внутри Panel, созданную с помощью компонентов VK UI.

Библиотека VK UI предоставляет практически полный набор компонентов, необходимых для построения интерактивного приложения: всевозможные элементы форм, попапы, стилизованные алерты, галереи, панели навигации, спиннеры, аватары, футеры и так далее.

Как видно, появился ещё один пакет vkontakte:

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

Основное правило — правильно использовать компонент либо собственную верстку шапки. В правой части шапки нативное приложение «ВКонтакте» размещает кнопки управления.

Стоит обратить внимание: «ВКонтакте» заявляет, что компоненты могут отображаться на десктопах не совсем адекватно. Однако их можно стилизовать, добавляя свои css-правила. Например, так была стилизована анимация переходов между панелями в одном приложении:

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

Библиотека VK Connect

Библиотека VK Connect предоставляет доступ к широким возможностям как самой сети «ВКонтакте», так и к возможностям устройства, если мы работаем из-под мобильного приложения. Для ее подключения нужно установить пакет vkontakte/vk-connect: npm i —save-dev vkontakte/vk-connect.

Среди многочисленных возможностей VK Connect — сканирование QR-кода, получение геопозиции, вызов карточки контактов. Также есть широкие возможности по использованию возможностей соцсети: включение-выключение уведомлений, публикация записей на стене, авторизация сообщества, подписка на сообщения. Их нужно использовать с умом: например, существует ограничение на количество уведомлений — не более одного в сутки. Есть отдельные рекомендации по уведомлениям. Полный список возможностей представлен в документации.

Чтобы наше приложение вообще начало работу, нужно сначала выполнить инициализацию:

Все дальнейшее взаимодействие с библиотекой происходит похожим образом. Методом connect.send вызываем нужное действие и слушаем ответы. Для этого мы должны подписаться на события:

В объекте detail возвращается type — название типа события, ответ на которое мы ждем, и data — набор данных. В примере выше мы слушаем ответ на запрос connect.send(«VKWebAppGetUserInfo», <>), который должен вернуть данные о пользователе приложения: имя, пол, дату рождения, место проживания, ссылку на картинку аватара в соцсети.

«ВКонтакте» не гарантирует поддержку всех событий на всех устройствах (iOS, Android, Web), поэтому лучше делать проверку такой поддержки перед исполнением кода:

VK Connect также обеспечивает поддержку запросов к API VK, если нужно что-то большее, чем может предоставить сама библиотека VK Connect:

VK Pay

VK Pay — это, по сути, удобный фронтенд для использования онлайн-сервиса оплаты с помощью Деньги Mail.Ru. Для вызова платежной формы достаточно открыть платежное окно с помощью вызова в библиотеке VK Connect:

Таким образом, можно продавать ваши услуги и товары, используя внутреннее платежное средство в сети «ВКонтакте». Подробнее в официальной документации.

Источник