Developers » VK Tunnel
VK Tunnel
Очень часто в веб-разработке требуется показать своё приложение другим пользователям. В случае боевой версии сайта беспокоиться не о чем, но если во время разработки вы пользуетесь локальным сервером, то показать промежуточные результаты на нём — нетривиальная задача.

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

VK Tunnel — это утилита, которая позволит отобразить в интернете веб-сервер, работающий на вашем локальном компьютере.
После запуска VK Tunnel Вы можете отслеживать в терминале информацию о состоянии и показателях соединений, установленных через ваш туннель.

Проект: https://www.npmjs.com/package/@vkontakte/vk-tunnel

1. Использование
2. Переменные окружения и опции
1. Использование
Вы можете настроить работу через VK Tunnel для сервера, поднятого на любых технологиях.
Ниже мы приведем самый простой пример: запуск при создании VK Mini Apps из шаблона.

В иных случаях внимательно изучите используемые опции и их значения.
Использование в VK Mini Apps
Установите пакет:
npm install @vkontakte/vk-tunnel -g

Создайте приложение из шаблона:
npx @vkontakte/create-vk-mini-app <foldername>

Перейдите к папке проекта при помощи команды
cd <foldername>

Запустите проект командой:
npm start

И сделайте вызов в консоли проекта:
env NODE_TLS_REJECT_UNAUTHORIZED=0 \
PROXY_HTTP_PROTO=https \
PROXY_WS_PROTO=wss \
PROXY_HOST=localhost \
PROXY_PORT=10888 \
vk-tunnel

Или, используя опции:
vk-tunnel --insecure=1 --http-protocol=https --ws-protocol=wss --host=localhost --port=10888

В терминале будет предложено перейти по адресу в формате
https://oauth.vk.com/code_auth?stage=check&code=2a2aaaa для авторизации. Откройте ссылку в браузере, вернитесь в терминал и нажмите enter
После успешной авторизации в терминале появится ссылка вида
https://user12345-jv7zlzzz.wormhole.vk-apps.com

Укажите её в поле URL в управлении Вашим мини-приложением для дальнейшей работы. Если приложение ещё не создано — воспользуйтесь инструкцией
2. Переменные окружения и опции
Вы можете настроить работы при помощи опций или переменных окружения.
В таблице представлены переменные и опции, им соответствующие.

ПеременнаяОпцияОписание
NODE_TLS_REJECT_UNAUTHORIZED--insecure    флаг, позволяет пропустить проверку самоподписанных сертификатов
Возможные значения:
  • 0 — пропустить проверку
  • 1 — проверить сертификат (в случае, если передается через опцию, логика обратная)
PROXY_HTTP_PROTO--http-protocol              схема для HTTP протокола
Возможные значения:
  • http — нешифрованное соединение
  • https — шифрованное соединение

    Значение по умолчанию: http
PROXY_WS_PROTO--ws-protocol        Схема для Web Socket-протокола
Возможные значения:
  • ws — нешифрованное соединение
  • wss — шифрованное соединение

    Значение по умолчанию: *ws*
PROXY_HOST--host    хост, на котором запущен проект
Значение по умолчанию: localhost
PROXY_PORT--port    порт, на котором запущен Ваш проект
Значение по умолчанию: *10888*