미라클 모닝 챌린지 슬랙 봇 2 - 슬랙 api 연동하기

김지욱·2021년 8월 3일
2

지난 포스팅에서 프로젝트를 시작하게 된 계기와 계획에 대해서 정리했었다.
이번 글에서는 슬랙 api를 연동하기 위한 과정에 대해 이야기해보려 합니다.

Bolt 로 Slack bot 만들기

슬랙 연동은 Bolt 를 사용하기로 했다. Bolt는 슬랙 앱을 빠르게 연동 시킬 수 있는 프레임 워크다.
NodeJs로 만들어졌고 공식 문서도 친절하게 설명되어있다.
소켓 모드를 통해 지정된 메서드들로 이벤트를 수신하고 메시지를 주고 받을 수 있다.

// 기본 예시
// hi를 전송하면 Hello를 보낸다.

app.message('hi', async ({ message, say }) => {
  await say(`Hello, <@${message.user}>`);
});

1. Slack App 생성

슬랙 앱 관리 페이지에서 새로운 앱을 하나 생성 해주고
해당 화면에서 App Name과 WorkSpace를 지정 해준다.

2. initialize

Bolt의 소켓 모드를 통해 통신을 하기 위해서는 bot token, signing secret등과 같은 설정 값이 필요하다.

const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  socketMode:true,
  appToken: process.env.SLACK_APP_TOKEN
});

위의 설정 값들을 받아오기 위한 작업을 진행해보자.

3. Basic Information

#Signing Secret

위에서 앱을 만들었다면 처음 화면에 Basic Information 페이지가 나온다.
스크롤을 아래로 내리면 App Credentials 블록이 나오는데 여기서 Signing Secret을 확인해 준다.

SLACK_SIGNING_SECRET=<Signing-Secret>

#App Token

다음으로 바로 아래 있는 App-Level Tokens에서 Generate Token and Scopes 를 클릭해서 Scope를 connections:write 로 추가해 주고 토큰을 생성한다.

SLACK_APP_TOKEN=<App-Level-Tokens>

4. OAuth & Permissions

#scope 설정

OAuth & Permissions 페이지에서 아래로 스크롤을 내리면 scope를 설정할 수 있다.
Bot Token Scopes 에서 chat:write 권한을 설정을 추가 해준다.

#Bot Token

다음으로 bot token을 얻기 위해 Install App to Workspace를 클릭해서 권한 승인을 해주면 아래와 같이 토큰을 받을 수 있다.

SLACK_BOT_TOKEN=<Bot-User-OAuth-Token>

5. 이벤트 설정

마지막으로 이벤트를 수신하고 응답하기 위한 설정이 필요하다.

#Socket Mode


소켓 모드 를 on으로 설정한다.

#이벤트 구독


Event Subscriptions 페이지에서 이벤트를 구독하고 4가지 bot 이벤트를 추가 해준다.

Event를 설정하고 나서 Save Changes 버튼을 누르면 상단에 알림이 하나 생기는데 reinstall your app 버튼을 꼭 눌러서 새로고침을 해주어야한다.

여기까지 하면 Bolt를 사용하기 위한 기본 설정이 모두 끝났다


hello 보내기

이제 연동이 제대로 이루어 졌는지 확인 하기 message() 메서드를 활용해서 기본적인 메시지를 주고 받아 보자.
기본 프로젝트 설정을 완료하고 @slack/bolt 패키지를 설치한다.

mkdir slack_bot
cd slack_bot
npm init
npm install @slack/bolt

위에서 받아온 값들로 환경 변수 설정을 해주고 Initialize해준다.

const { App } = require('@slack/bolt');

const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  socketMode: true,
  appToken: process.env.SLACK_APP_TOKEN
});

app.message('hello', async ({ message, say }) => {
  await say(`Hey there <@${message.user}>!`);
});

(async () => {
  await app.start(process.env.PORT || 3000);
  console.log('⚡️ Bolt app is running!');
})();

메인에 위와 같이 작성하고 app을 실행시켜준다. 슬랙에서 채널에 해당 앱을 추가 해주고
hello라는 메시지를 보내면 응답을 제대로 보내오는 걸 확인했다.


여기까지 Bolt를 활용한 슬랙 연동을 완료했다.
다음 포스팅에서는 다양한 리스너 이벤트를 활용해서 챌린지를 하기 위한 문제 모달창과 정답 입력 및 결과를 확인할 수 있는 Bot을 만드는 과정을 정리해 볼 예정이다.

Bolt의 문서의 설명이 잘 되어 있기는 한데 (그럼에도 불구하고..)설정 하나를 놓치는 바람에 "hello" 메시지를 보내기까지 꾀나 삽질을 해야 했었다. 원하는 레퍼런스가 없었어서 해당 내용이 필요한 분들이 있지 않을까 싶어서 정리를 해봤습니다.

0개의 댓글