Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Всем привет! Я Лаптев Алексей, основатель и главный разработчик сервиса no-code интеграций apimonster.

Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Проблема на рынке

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

Типовые задачи:

  1. Аналитика маркетплейсов: заказы/продажи/остатки/текущие товары.
  2. Расширенная аналитика данных Яндекс Метрики/Google Analytics
  3. Аналитика расходов из Яндекс Директ

Если готового сервиса под задачу нет, то задача сильно усложняется.

Решение

Используем сервис ApiMonster.

Он позволяет совместить написание логики работы с api на javascript + готовые коннекторы для заливки данных в google sheets.

Пример

Давайте разберемся как выгрузить отчет по utm-меткам из Яндекс Метрики в Google Sheets, чтобы получилось так:

Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Шаг 1. Пишем логику выгрузки данных

Самая сложная часть, но если разберетесь в коде — сможете вытащить данные из любого API. Шаблон один.

Конечная цель кода — вытащить данные из API и сформировать нужный CSV, который загрузим в Google Sheets.

Нарисовать можно любой CSV согласно вашему ТЗ на дашборд.

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

//подключаем библиотеки const fetch = require("sync-fetch"); //вспомогательные функции function createUrl(baseUrl, params) { let items = []; for (let key in params) { items.push(key + "=" + params[key]); } return baseUrl + "?" + items.join('&'); } function createCsv(csvRows) { return csvRows.join("\r\n"); } //токены let token = "AQAAAAAm6eb9AAc4_1234"; //формируем ссылку в api let dateFrom = "2024-03-01"; let dateTo = "2024-03-31"; let params = { "id": 82227123, "metrics": "ym:s:visits,ym:s:users", "dimensions": "ym:s:UTMSource,ym:s:UTMMedium,ym:s:UTMCampaign,ym:s:UTMContent,ym:s:UTMTerm", "date1": dateFrom, "date2": dateTo }; let baseUrl = "https://api-metrika.yandex.net/stat/v1/data"; let url = createUrl(baseUrl, params); //делаем запрос в api let headers = { 'Content-Type': 'application/json;charset=utf-8', 'Authorization': "OAuth " + token }; let response = fetch(url, {method: "get", "headers": headers}); //если вернулся корректный ответ if (response.status === 200) { let data = response.json(); //ответ api let csvRows = []; //массив строк для будущего csv //смотрим что вернуло api // console.log(data); //рисуем заголовок дашборда csvRows.push("Отчет по UTM-меткам, период: " + dateFrom + " - " + dateTo); csvRows.push(""); csvRows.push(data.query.dimensions.join(";") + ';' + data.query.metrics.join(";")) //рисуем строки дашборда data.data.forEach(function (item, i, arr) { let rowData = []; rowData.push(item.dimensions[0].name); rowData.push(item.dimensions[1].name); rowData.push(item.dimensions[2].name); rowData.push(item.dimensions[3].name); rowData.push(item.dimensions[4].name); rowData.push(item.metrics[0]); rowData.push(item.metrics[1]); csvRows.push(rowData.join(";")); }); //делаем csv let result = createCsv(csvRows); // смотрим что получилось в csv // console.log(result); //возвращаем результат для дальнейших шагов связки return result; } else { //ошибка запроса }

Шаг 2. Создаем подключения

Тут задача получить доступ к нужному Google Sheets.

Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Шаг 3. Настраиваем связку

Тут уже просто

  1. Входящий вебхук является триггером запуска связки, полезных данных не несет
  2. Запускается JS код которые вытаскивает данные из API и формирует CSV. Код берем из шага 1.
  3. Очищаем лист в Google Sheets куда будем заливать данные.
  4. Заливаем наш CSV из шага 2.
Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Шаг 4. Настройка расписания запуска связки

Тут смысл — дергать вебхук по расписанию, который в свою очередь запустить связку. Шаг 1 из предыдущего пункта.

Можно выбрать дни и часы запуска.

Обычно достаточно 1 раз в сутки часа в 03:00.

Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Шаг 5. Результат

Если все сделали верно — в google sheets упадут данные из CSV.

Обратите внимание — что можно управлять видом дашборда меняя логику форматирования в CSV.

Кейс: с помощью no-code и javascript вытащить данные из API и сделать дашборд в Google Sheets

Преимущества No-Code и JavaScript

  1. Не надо поднимать всю инфраструктуру для запуска своих скриптов и тратить время на решение технических задач чтобы она стабильно работала — занимайтесь только бизнес-логикой.
  2. Полученные данные можно выгружать в более 100 сервисов — коннекторы готовы.
  3. Если вы не можете сами написать логику — легко найти программиста. JavaScript один из самых популярных языков, а сами задачи для программиста несложные.
  4. Стабильность. No-code сервис сильно надежнее, чем свой сервер на коленке. Если что-то упадет — все решиться скорее всего без вашего участия.

Итого

Если у вас задача вытащить данные из API и нарисовать какой-то дашборд в Google Sheets — данный инструмент максимально упростить задачу.

Подходит для любого API.

22
Начать дискуссию