Перейти к содержимому

Как запустить мини приложение вк на python

  • автор:

Вопросы с меткой [vk-mini-apps]

Руководство по использованию метки vk-mini-apps отсутствует.

28 вопросов
Конкурсные
Неотвеченные

  • Конкурсные 0
  • Неотвеченные
  • Цитируемые
  • Рейтинг
  • Неотвеченные (мои метки)

18 показов

Как обновить содержимое нынешней страницы React по выполнению асинхронной функции, результатом которой должно стать конкретное значение

Есть код, внутри него есть кнопка, которая вызывает функцию send_about() Задача стоит следующая, чтобы после того как в fetched_info положили информацию, выполнилась функция setPopout(null) Я бьюсь .

задан 5 ноя в 22:24
11 показов

Отображение vk mini app на ios устройствах

Разрабатываю vk mini app на reactjs. Столкнулся с такой проблемой: на андроид и декстопе все отображается корректно, но потом запустил на iphone SE 2020 и увидел, что у IOS статус бар наезжает на body.

задан 23 окт в 14:50
69 показов

React переход между экранами (компонентами)

Продолжаю изучать React, и мне стал интересен один момент. Есть навигация по страницам через react-router-dom, тут все понятно, переход по страницам без перезагрузки страницы. Но я наткнулся на .

задан 20 фев в 7:58
25 показов

Как узнать в какие группы установлено приложение vk mini apps?

Запрос на установку приложения в группу выполненен таким образом, но если пользователь уже установил приложение в группу, то как узнать список группу/группу в которое уже установлено приложение? Еще .

задан 6 фев в 17:06

Не работает мини приложение вк на локальной машине

Пытаюсь уже на второй машине запустить мини приложение, но у меня постоянная загрузка. Установил всё что написано на этой странице. Платформа Windows 10. С чем это может быть связано? Node — v16.18.1 .

задан 1 дек 2022 в 13:52
1k показов

module ‘vk’ has no attribute ‘Session’

Использовал модуль нормально больше года, сегодня при установке в новом проекте он стал выдавать оишбку на до этого рабочем коде. import vk vk_Id = input() token = «тут мой токен» session = .

задан 18 сен 2022 в 18:57

Вывести результат события VK Bridge

Создаю мини-приложение на основе библиотеки @vkontakte/create-vk-mini-app (https://www.npmjs.com/package/@vkontakte/create-vk-mini-app). Пытаюсь вывести VKWebAppGetClientVersion — номер версии .

задан 30 июн 2022 в 13:51
480 показов

проблемма с users.get vk.api

Я использую метод users.get для получения информации с профиля пользователя вк. Возьмем случайную страницу https://vk.com/id680277389 . При запросе вида vk_api.users.get(user_id=vk_Id, v=5.131), .

задан 30 июн 2022 в 13:45
86 показов

@vkontakte/create-vk-mini-app получаю ошибка Uncaught SyntaxError: Unexpected token ‘

Знаю, что много кто задавал похожий вопрос, но не нашел ответа для laravel. Вообще, проблема в следующем. Создаю react проект через @vkontakte/create-vk-mini-app, после чего делаю сборку yarn build .

задан 22 дек 2021 в 19:19

Как достать first_name

Нужно достать элемент first_name Я обращаюсь к библиотеке VkBridge — bridge.send(‘VKWebAppGetUserInfo’); Как достать из объекта first_name и вывести в консоль?

задан 7 окт 2021 в 16:00

Почему socket.io теряет соединение?

Всем добрый День. На данный момент занимаюсь разработкой VK MINI APPS приложения. Использую технологии React, node.js и socket.io (в связке с socket.io-client, оба имеют 4.2.0 версию). Столкнулся со .

задан 11 сен 2021 в 11:36
347 показов

VK mini apps. Аунтефикация пользователя

У меня имеется приложение на Vue. Решил разместить его во ВКонтакте, чтобы оно стало vk mini apps. По сути vk mini apps открывает «сайт приложения» во фрейме, но каким способом можно .

задан 7 апр 2021 в 20:37
170 показов

Почему ошибка?я новичек и только начал изучать react и вк апи

вот отрывок кода где выдаёт ошибку const storageData = await bridge.send(‘VKWebAppStorageGet’, props:< keys: Object.values(STORAGE_KEYS) >); вот сама ошибка SyntaxError: C:\Users\megat\minini\src\.

задан 21 фев 2021 в 8:01
3k показов

API для эмодзи статусов ВК

Есть ли методы API ВКонтакте для установки эмодзи статуса? Эмодзи статус могут ставить приложения «Covid-19» от ВКонтакте и «Школа дружбы» от My Little Pony, но можно ли добавить .

задан 25 ноя 2020 в 18:34
2k показов

vk mini app не открывается с телефона

С web версии и с мобильной версии все работает, а в мобильном приложении бесконечная загрузка. SSL сертификат самоподписанный, может в этом дело? В /var/log/nginx/access.log запросы с мобильного .

Saved searches

Use saved searches to filter your results more quickly

Cancel Create saved search

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

This repository has been archived by the owner on Apr 13, 2022. It is now read-only.

monosans / vk-vbitve-bot Public archive

Бот для мини-игры «ВБитве 2022» ВКонтакте.

License

monosans/vk-vbitve-bot

This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Switch branches/tags
Branches Tags
Could not load branches
Nothing to show
Could not load tags
Nothing to show

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Cancel Create

  • Local
  • Codespaces

HTTPS GitHub CLI
Use Git or checkout with SVN using the web URL.
Work fast with our official CLI. Learn more about the CLI.

Sign In Required

Please sign in to use Codespaces.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

Latest commit message
Commit time

README.md

Бот для мини-игры «ВБитве 2022» ВКонтакте.

Установка на Windows

  • Устанавливаем Python (для Windows 7 нужен Python 3.8.X). Во время установки обязательно ставим галочку Add Python to PATH (Добавить Python в PATH) .
  • Скачиваем архив с ботом.
  • Распаковываем архив.
  • Редактируем файл config.py через текстовый редактор:

Запуск: start.bat . Если после запуска выводится Python или выходит ошибка, связанная с Python или pip:

  • Откройте cmd
  • Напишите python -V
  • Вывод должен соответстовать виду: Python версия . При этом версия должна быть выше 3.6.X.
  • Если вывод не соответствует виду, нужно заново выполнить первый пункт инструкции (переустановить Python).

Установка в Termux (Android)

  • Устанавливаем Termux с F-Droid, т. к. в Google Play разработчик его больше не обновляет.
  • Запускаем Termux.
  • Пишем по порядку:
cd pkg update -y pkg install -y git python git clone https://github.com/monosans/vk-vbitve-bot
  • Чтобы получить VK_AUTH_HEADER и FRIENDS_HEADER с телефона, используем приложение F12:
    1. Открываем приложение F12, заходим на сайт мобильного ВКонтакте и авторизуемся.
    2. Открываем игру через тот же F12.
    3. Нажимаем кнопку F12, переходим на вкладку Network (3-я по счёту).
    4. Ставим галочку около Advance .
    5. Сворачиваем панель и нажимаем на стрелочку для перезагрузки страницы.
    6. Вновь нажимаем кнопку F12, переходим на вкладку Network .
    7. Немного листаем вверх и находим запись https://www.inbattle.space/get , нажимаем по ней.
    8. Появится ещё одна панель. Под записью Request Headers находим поле vk-auth .
    9. Копируем его значение (начинается c vk_access_token_settings).
    10. Вставляем скопированный текст в значение VK_AUTH_HEADER в config.py между кавычками.
    11. Возвращаемся в приложение F12 .
    12. Под записью Request Headers находим поле friends .
    13. Копируем его значение (состоит из цифр).
    14. Вставляем скопированный текст в значение FRIENDS_HEADER в config.py между кавычками.
  • Про остальные настройки можно прочитать в инструкции для Windows.

Запуск: sh vk-vbitve-bot/start.sh

Переустановка в Termux

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

cd rm -rf vk-vbitve-bot

После этого заново установить по инструкции.

Как работать с Vk Mini App на python?

Можно ли сделать Vk Mini Apps на python, как подключить vk-bridge к js?

  • Вопрос задан более трёх лет назад
  • 2608 просмотров

Комментировать

Решения вопроса 1

Sergey @KingstonKMS

Только так как описано на вк — см

Ответ написан более трёх лет назад

Dev12345 @Dev12345 Автор вопроса

Как подключить vk-bridge к js? (Не node js, а js в html)

Sergey @KingstonKMS

Dev12345, по ссылке все написано

Dev12345 @Dev12345 Автор вопроса

Sergey, там node js

Sergey @KingstonKMS

Dev12345, там есть ответ на ваш вопрос

Dev12345 @Dev12345 Автор вопроса

Sergey, покажите пожалуйста, я не вижу

Dev12345 @Dev12345 Автор вопроса

Там можно установить vk-bridge только на node js , как подключить к js (html) модуль vk-bridge я не знаю

Sergey @KingstonKMS

Ответы на вопрос 0

Ваш ответ на вопрос

Войдите, чтобы написать ответ

python

  • Python

Палиндромы leetcode, в VS все правильно, на сайте другой ответ, что делать?

  • 1 подписчик
  • 2 часа назад
  • 53 просмотра

html

  • HTML
  • +3 ещё

Почему не работает переход на страницу?

  • 1 подписчик
  • 3 часа назад
  • 82 просмотра

python

  • Python
  • +1 ещё

Реально ли вывести виджет с какой-либо инфой поверх PySide6.QtMultimediaWidgets.QVideoWidget?

  • 1 подписчик
  • 4 часа назад
  • 13 просмотров

python

  • Python

Почему не проходит код для решения задачи на leetcode?

  • 1 подписчик
  • 4 часа назад
  • 74 просмотра

python

  • Python

Почему текстовый редактор и консоль по-разному присваивают ссылки на переменные Python?

  • 1 подписчик
  • 4 часа назад
  • 30 просмотров

python

  • Python
  • +1 ещё

Почему callback_query_handler не видит call.data?

  • 1 подписчик
  • 9 часов назад
  • 40 просмотров

python

  • Python

При выводе users_cards выводится [, . ] как это исправить?

  • 1 подписчик
  • 10 часов назад
  • 34 просмотра

python

  • Python

В приложении django 4.2 + django rest framework: Model.__str__ нужен только для админки?

  • 1 подписчик
  • 13 часов назад
  • 47 просмотров

python

  • Python
  • +1 ещё

Не правильная проверка ячейки таблицы через цикл, почему не записывается переменная?

  • 1 подписчик
  • 13 часов назад
  • 37 просмотров

python

  • Python

Почему падает бот?

  • 1 подписчик
  • вчера
  • 85 просмотров

от 120 000 ₽

от 120 000 до 240 000 ₽

ATI.SU • Санкт-Петербург

от 170 000 до 260 000 ₽

19 нояб. 2023, в 23:12

55555 руб./за проект

19 нояб. 2023, в 20:35

4000 руб./за проект

19 нояб. 2023, в 20:11

500 руб./за проект

Минуточку внимания

Присоединяйтесь к сообществу, чтобы узнавать новое и делиться знаниями

  • Не могу настроить почтовый сервер(Postfix/Dovecot с интеграцией в MS Active Directory) на alt linux. Может у кого-то есть решение?
    • 3 подписчика
    • 1 ответ
    • 3 подписчика
    • 2 ответа
    • 2 подписчика
    • 1 ответ
    • 2 подписчика
    • 1 ответ
    • 3 подписчика
    • 2 ответа
    • 2 подписчика
    • 2 ответа
    • 2 подписчика
    • 1 ответ
    • 2 подписчика
    • 3 ответа
    • 2 подписчика
    • 1 ответ
    • 2 подписчика
    • 1 ответ

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

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

    image

    Первоначальная публикация статьи в блоге Mail.ru Cloud Solutions: https://mcs.mail.ru/blog/razrabotka-prilozhenij-v-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).

    Ваш веб-ресурс встраивается в приложение «ВКонтакте» через обычное 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. Соответственно, максимально простая установка:

    npm i —save-dev @vkontakte/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 — это конкретные шаги (экраны) в пользовательском сценарии. Абстрактно это выглядит так:

    import from ‘@vkontakte/vkui’; > >      >      

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

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

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

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

    import < Button, Div, FormLayout, Input, Panel, PanelHeader, PanelHeaderBack, Search, View >from "@vkontakte/vkui"; import Icon36Done from "@vkontakte/icons/dist/36/done"; import CustomTextarea from "./YourComponents/CustomTextarea"; render() < return ( 
    > />> >App Title height= />

    This is the first page

    You can do some interaction here

    value= /> onChange= />
    ) >

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

    npm i —save-dev @vkontakte/icons

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

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

    image

    import < Textarea >from «@vkontakte/vkui»; export default class CustomTextarea extends React.Component < render() < return ( 
    Custom textarea is here
    name= onChange= this.bindData(e, this.props.name)> value= className= />
); > >

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

.desktop_web < .View__panel—prev < max-width: 458px !important; margin: 0 auto; left: calc(50% — 230px) !important; -webkit-animation: root-android-animation-hide-back 3s cubic-bezier(.4, 0, .2, 1); animation: root-android-animation-hide-back 3s cubic-bezier(.4, 0, .2, 1); >.View__panel—next < max-width: 460px !important; left: calc(50% — 230px) !important; >> 

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

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

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

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

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

import connect from ‘@vkontakte/vk-connect’; connect.send(«VKWebAppInit», <>); 

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

connect.subscribe((e) => < switch (e.detail.type) < case «VKWebAppGetUserInfoResult» : this.bindConnectUserData(e.detail.data); break; >>); 

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

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

if (connect.supports(«VKWebAppGetUserInfo»)) …

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

connect.send(«VKWebAppCallAPIMethod», >);

VK Pay

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

connect.send(«VKWebAppOpenPayForm», >);

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

  • vk mini apps
  • javascript
  • вконтакте
  • vk
  • приложения вконтакте
  • mail.ru cloud solutions
  • JavaScript
  • Разработка мобильных приложений
  • ВКонтакте API

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *