Serverless Netlify - уведомления в Telegram

Подсмотрел у Никиты в блоге кнопочку фидбэка, которая модалку вызывает, и захотел себе такую же. Запилить кнопку, которая открывает модалку на 2,5 поля не так сложно, yarn add что-то там, все вместе слепить и готово. А вот как его получать - другой вопрос.

Ввиду того, что я любитель Telegram и уже делал “уведомлялки” с его помощью, то я решил не придумывать что-то новое, а просто слать уведомления себе в Telegram, но для этого нужен сервер, какой-никакой, токены ж на клиент передавать не будешь (хотя некоторые так делают, но это не мой путь). Но есть но, у меня же Gatsby, JAMstack и вот это все модное, потому просто сделать сервер - это слишком.

Будем использовать emoji-boomSERVERLESSemoji-boom, модно же и стильно (да и просто, как оказалось). Я юзаю Netlify, потому пошел на страницу ”Serverless Lambda functions on Netlify” и почитал что там и как делается, сей пост что-то вроде вольного пересказа в краткой форме.

Для начала надо бы среду разработки развернуть и все необходимые пакеты поставить:

yarn add netlify-lambda
yarn add node-fetch

Теперь правим build и develop скрипты:

"lambda": "netlify-lambda serve lambda",
"build": "yarn run clean && gatsby build && netlify-lambda build lambda",

Скрипт “build” на последнем шаге будет собирать все функции, которые лежат в директории “lambda”, скрипт “lamda” будет запускать dev-сервер на 9000 порту. В “netlify.toml” в секцию “build” добавляем строчку functions = "server", где “server” - директория, куда будут складываться уже собранные функции.

Складываем наши функции в директорию, которую мы описали (у меня - “lambda”), в моем случае был один файлик “feedback.js”, соответственно после запуска dev-сервера я могу отправлять запросы к этой функции на “localhost:9000/feedback”, а в prod-режиме (уже после деплоя на Netlify) на “/.netlify/functions/feedback”.

Готово, у нас есть сконфигурированное окружение и файлик, куда надо писать код, я буду писать туда код по отправке сообщений от имени Telegram-бота, в сниппете используются переменные окружения, которые можно задать в админке сайта, в “Settings -> Build & deploy -> Environment”.

import fetch from 'node-fetch';

const { TELEGRAM_BOT_TOKEN, TELEGRAM_USER_ID } = process.env;

exports.handler = async ({ body, httpMethod }) => {
  if (httpMethod !== 'POST') {
    return { statusCode: 405, body: 'Method Not Allowed' };
  }

  const { page, message, type } = JSON.parse(body);

  const text = encodeURI(`New blog feedback!\n\nPage: ${page}\nType: ${type}\nMessage: ${message}`);
  const url = `https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage`;
  const params = `chat_id=${TELEGRAM_USER_ID}&disable_web_page_preview=1&text=${text}`;

  return fetch(`${url}?${params}`)
    .then((response) => response.json())
    .then(() => ({ statusCode: 200, body: 'ok' }))
    .catch((error) => ({ statusCode: 422, body: String(error) }));
};

Запускаем локально, стучимся postman’ом, проверяем работу и деплоим на Netlify, не забывая, что prod и dev адреса функций различаются.

Готово, модная serverless система уведомлений на NodeJS для Telegram работает и пересылает нам фидбэки, можно писать пост в блог.

Published

# ReactJS, Serverless, Netlify, Blog, JavaScript

© Igor Fedyukin 2009 - 2020