GREEN-API — WhatsApp Web Client

Веб-интерфейс для взаимодействия с WhatsApp через GREEN-API.
Тестовое задание на позицию DevOps-разработчик.

Демо

🔗 Открыть страницу

Скриншот

Возможности

Приложение реализует 4 метода GREEN-API:

Метод	Описание
getSettings	Получение настроек инстанса WhatsApp
getStateInstance	Проверка состояния инстанса (авторизован / не авторизован)
sendMessage	Отправка текстового сообщения по номеру телефона
sendFileByUrl	Отправка файла по URL на указанный номер

Ответы API отображаются в реальном времени в правой панели с метками времени.

Быстрый старт

1. Получение учётных данных

1. Зарегистрируйтесь на green-api.com (бесплатный аккаунт разработчика)
2. Создайте новый инстанс в личном кабинете
3. Отсканируйте QR-код для привязки номера телефона
4. Скопируйте idInstance и ApiTokenInstance

2. Запуск

git clone https://github.com/vladislav-devops/green-api.git
cd green-api

Откройте index.html в браузере — никаких зависимостей и сборки не требуется.

3. Использование

1. Введите idInstance и ApiTokenInstance
2. Нажмите getSettings или getStateInstance для проверки подключения
3. Введите номер телефона (формат: 77771234567) и текст сообщения
4. Нажмите sendMessage — сообщение будет отправлено через WhatsApp
5. Для отправки файла укажите номер и прямую ссылку на файл, нажмите sendFileByUrl

Структура проекта

green-api/
├── index.html      # Основная страница
├── styles.css      # Стили
├── script.js       # Логика вызовов API
├── img/
│   ├── eye.png     # Иконка показать пароль
│   └── hide.png    # Иконка скрыть пароль
└── README.md

Технологии

Проект реализован на чистом HTML/CSS/JavaScript без фреймворков и зависимостей. Взаимодействие с GREEN-API осуществляется через Fetch API.

Автор

Vladislav — DevOps Engineer