В этом руководстве вы узнаете, как настроить приложение Slack, которое будет отображать информацию из API Meetup, которое передает сохраненные данные из Meetup в другое прикладное программное обеспечение.

Meetup - популярный сайт, на котором люди со схожими интересами объединяются в группы для организации мероприятий в своих городах.

После успешного выполнения запроса к API Meetup мы получим ответ от Meetup, извлечем определенные данные из полезной нагрузки JSON и отобразим эти данные в Slack. Мы разработаем вложение для нашего приложения Slack так, чтобы оно отображало название события, описание, дату и время, место и многое другое!

Как это работает:

Когда вы отправляете /nextmeetup 94709&javascript (или любой почтовый индекс и интересующую тему) в окно сообщения Slack, срабатывает веб-перехватчик. Веб-перехватчик, созданный и размещенный в стандартной библиотеке, сначала отправит запрос в API Meetup, который вернет полезную нагрузку JSON с результатами запроса.

Затем веб-перехватчик создает сообщения Slack для каждого события и отправляет их в указанный канал.

Не нужно расстраиваться! Давайте делать это шаг за шагом.

Что вам понадобится:

1x Slack Account

1x Meetup Account

1x стандартная учетная запись библиотеки

Шаг 1. Настройте приложение Slack

Убедитесь, что вы вошли в Slack и зайдите в панель управления Slack Apps по адресу https://api.slack.com/apps. Вы увидите экран, который выглядит следующим образом.

Нажмите Создать новое приложение. Вам будет предложено ввести имя приложения и рабочую область разработки Slack, в которую вы хотите его добавить.

Отсюда нажмите Создать приложение, вы попадете на страницу Основная информация.

Прокрутите вниз до Показать информацию. Здесь вы можете дать своему приложению Slack имя, описание и изображение, если хотите.

Не закрывайте страницу Основная информация в браузере. Через секунду мы воспользуемся им, чтобы получить учетные данные вашего приложения Slack, чтобы подключить это приложение к бэкэнд-логике, размещенной в стандартной библиотеке, - коду, запускающему ваше приложение.

Шаг 2. Создайте бесплатную учетную запись стандартной библиотеки

Мы будем размещать код нашего приложения Slack в Стандартной библиотеке - код, который будет запрашивать и получать конкретную информацию из Meetups API. Так что перейдите в Код стандартной библиотеки и получите бесплатную учетную запись.

Шаг 3. Скопируйте и измените шаблон кода приложения Slack в стандартной библиотеке

После того, как вы войдете в систему или зарегистрируетесь, вы попадете на страницу «Рекомендуемый источник API». Это шаблоны кода приложений, доступные в стандартной библиотеке, чтобы любой мог легко копировать и изменять приложения. Вы собираетесь выбрать шаблон кода приложения Slack и изменить его, чтобы создать свой API, который будет обеспечивать работу вашего приложения Slack.

Введите уникальное имя для своего проекта API и нажмите ОК.

Краткое объяснение шаблона исходного кода приложения Slack:

Давайте сделаем паузу, чтобы понять, на что мы смотрим. Левая боковая панель - это каркас проекта API, который Стандартная библиотека настроила для вас для создания приложений Slack.

В шаблоне кода для Slack Apps есть четыре каталога. Мы будем работать только в каталоге functions, в котором есть еще три папки.

actions/, commands/, and events/ а также один файл __main__.js. Инструкции по действиям Slack, командам с косой чертой и событиям для вашего приложения находятся внутри этих папок.

Когда вы развертываете свой API, Стандартная библиотека автоматически генерирует конечные точки HTTPS (URL-адреса) для каждого каталога. Полученные URL-адреса позволят нам настроить веб-перехватчики, которые будут прослушивать и реагировать на действия Slack, команды с косой чертой и события.

Все пять папок (включая папку functions настроены с __main__.js file (основная конечная точка каталога). Эти конечные точки__main__.js отправляют соответствующие функции, когда они получают сообщение от Slack. В этом руководстве файл__main__.js будет отправлять конечную точку commands, когда мы вызываем наш API через Slack Bot. Теперь вернемся к настройке нашего бота!

Шаг 4. Добавьте команду в стандартную библиотеку API

commands: Каталог commands является конечной точкой для всех команд Slack с косой чертой. Создайте дополнительную команду, поместив курсор в каталог commands и щелкнув правой кнопкой мыши. Выберите Новый файл, назовите свой командный файл с косой чертой nextmeetup.js и нажмите ОК.

На этом этапе вы заметите внутри себя функцию JavaScript «hello world» (__main__.js), которая генерируется автоматически.

Замените содержимое nextmeetup.js следующим:

Краткое объяснение Кодекса:

Отправляя /nextmeetup через приложение Slack, вы отправляете запрос GET в API Meetup.

Каждый запрос к Meetups API должен быть аутентифицирован с помощью ключа API, поэтому мы передаем наш ключ Meetup из нашего env.json файла в наш запрос. Мы также отправляем наш GET-запрос с двумя параметрами: zip и topic.

API Meetup возвращает массив объектов событий встречи, которые мы можем просмотреть из журналов кода в стандартной библиотеке, зарегистрировав наш ответ: console.log(response.data). Вкладка ваших журналов находится под разделом отладки.

response.data - это массив событий, соответствующих вашему запросу, и мы хотим создать два вложения для каждого события (одно для местоположения и одно для деталей). У нас есть функция под названием formatAttachement, которую мы можем вызывать при каждом из событий. Результаты помещаются в массив с именем attachments, который отправляется в Slack.

Скопировав и вставив код в файл nextmeetup.js, сохраните изменения и перейдите к файлу env.json в меню левой панели.

Шаг 5. Заполните файл env.json учетными данными и ключами приложения

Внутри env.json вы увидите переменные среды для вашего API. Вы можете установить разные значения для локальной среды, среды разработки и выпуска (производственной). Этот файл будет содержать все ваши уникальные ключи доступа к вашей учетной записи стандартной библиотеки, учетной записи Meetup и учетным данным приложения Slack.

Мы будем вносить изменения только в "dev" переменные окружения - убедитесь, что вы изменяете правильный набор! Обратите внимание, что "dev”values ​​предназначены для вашей среды разработки, а "release"values ​​следует указывать только тогда, когда вы готовы выпустить свое приложение. “local” variables можно оставить пустыми при развертывании из кода в стандартной библиотеке, но они должны быть заполнены при работе с инструментами командной строки.

Начнем с заполнения переменной “STDLIB_TOKEN”. Поместите курсор между кавычками (см. Экран) и щелкните правой кнопкой мыши и выберите Вставить токен библиотеки… или используйте сочетание клавиш ⌘ + K.

Выберите Маркер библиотеки, чтобы заполнить "dev" среду.

Теперь вернитесь на страницу Основная информация вашего приложения Slack и прокрутите вниз до Учетные данные приложения:

Скопируйте свой идентификатор клиента, секрет клиента и токен подтверждения. Вставьте их в соответствующие поля в“dev” разделе файла env.json.

Добавьте имя, которое вы дали своему приложению Slack для theSLACK_APP_NAME.

Ex: SLACK_APP_NAME:Meetup-bot

Значение “SLACK_REDIRECT” будет конечной точкой https, сгенерированной стандартной библиотекой после развертывания вашего API. Несмотря на то, что мы еще не развернули, заполните его сейчас, используя эту структуру. https://<username>.api.stdlib.com/<apiname>@dev/auth/ - с вашим именем пользователя стандартной библиотеки и вашим именем API. Как только мы развернем код, вы можете вернуться, чтобы подтвердить, что вы правильно ввели это значение.

Мой SLACK_REDIRECT выглядит так: https://Janethl.api.stdlib.com/slack-meetup-bot@dev/auth/ - убедитесь, что вы добавили путь аутентификации с косой чертой в конце.

Возможности и разрешения вашего приложения Slack уже будут настроены со следующими областями:

«SLACK_OAUTH_SCOPE»: _ 38_

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

Шаг 6. Получите свой ключ API Meetup

Войдите или создайте учетную запись на Meetup.com. Перейдите на https://secure.meetup.com/meetup_api/key/, чтобы получить свой уникальный ключ API. Нажмите на замок, чтобы открыть свой ключ API, и скопируйте его.

Вернитесь к вашему env.json файлу в Коде стандартной библиотеки. Добавьте свой ключ Meetup как значение "key", точно так же, как я сделал на изображении:

Обязательно сохраните изменения с помощью ⌘ + s (или нажмите Сохранить в правом нижнем углу).

На боковой панели меню откройте файл __main__.js, расположенный под каталогом событий. Разверните код своего приложения Slack в стандартной библиотеке, нажав «Выполнить».

  • Вскоре после развертывания вашего кода Стандартная библиотека генерирует URL-адрес конечной точки HTTPS API, где находится ваш код. Этот адрес состоит из вашего ‹username› .api.stdlib.com, за которым следует имя, которое вы дали своему API в среде: «https://janethl.api.stdlib.com/slack-meetup-bot@dev/ физ

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

Шаг 7. Создайте новую команду косой черты и установите веб-перехватчик

Теперь нам нужно настроить приложение Slack для ответа на команду косой черты (/). Для этого нам нужно настроить веб-перехватчик на странице Slacks API.

Что такое Webhook?

Возможно, мы сможем понять, что такое веб-перехватчик, сравнив его с API. API-интерфейсы основаны на запросах - это означает, что они работают, когда запрос сделан из стороннего приложения. Веб-перехватчик основан на событиях - код запускается, когда он запускается определенным событием.

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

Теперь, когда мы это понимаем, давайте перейдем к странице API Slack, чтобы настроить наш веб-перехватчик. Найдите и выберите Команды с косой чертой в меню боковой панели.

После нажатия Создать новую команду вам будет предложено ввести данные вашей команды, для этого примера используйте:

Команда: /nextmeetup

RequestURL: https://<username>.api.stdlib.com/<apiname>@dev/commands/:bg

Краткое описание: retrieves Meetup events

Совет по использованию: [<zip>&<topic>]

По завершении нажмите «Сохранить».

Шаг 8. Включите OAuth и разрешения

Вернитесь в Slack App, в меню боковой панели нажмите OAuth и разрешения.

Оказавшись там, вам нужно будет ввести URL переадресации следующим образом: https://<username>.api.stdlib.com/ <apiname>@dev/auth/

нажмите «Добавить» и «Сохранить URL».

Этот URL-адрес перенаправления должен совпадать с URL-адресом, который мы установили для env.json файла в Code on Standard Library.

Шаг 9. Добавьте бота в ваше приложение Slack

Вернитесь на страницу приложения Slack и нажмите Пользователи-боты на левой боковой панели . Нажмите Добавить пользователя-бота. Оставьте настройки по умолчанию.

Последний шаг - авторизация приложения. В браузере введите: https://<username>.api.stdlib.com/<apiname>@dev/

Нажмите кнопку Добавить в Slack. Вы попадете на другой экран авторизации.

Нажмите Авторизовать. Вы должны увидеть сообщение об успешном выполнении!

Шаг 10. Протестируйте свое приложение Slack Meetup

Все готово. Попробуйте! Ваше приложение Slack теперь доступно для использования в рабочем пространстве Slack, для которого вы его авторизовали. Ваше приложение Slack должно отвечать на /nextmeetup<94709>&<javascript>, как показано на скриншоте выше.

Вот и все, спасибо!

Надеюсь, вы нашли этот урок полезным. Я хотел бы, чтобы вы прокомментировали здесь, отправили мне электронное письмо на Janeth [at] stdlib [dot] com или подписались на Стандартную библиотеку в Twitter, @StdLibHQ .

Джанет Ледеза (Janeth Ledezma) - защитник разработчиков стандартной библиотеки и выпускник Калифорнийского университета - вперед, медведи! Когда она не изучает арабский язык или не занимается спортом, вы можете найти ее изучает NorCal на своем CBR500R. 🏍💨🤗 Следите за ее путешествием со Стандартной библиотекой через Twitter @mss_ledezma.