Runkit이 필요 없는 단순한 서버의 Slack App

18282 단어 Node.jsJavaScript
지금까지 나는 런키트로 슬랙의 투표 앱을 만들었다.발레 & DB무라니.

이 보도는 이 투표 응용의 제작 방법을 소개했다.
(Runkit을 모르시는 분들은 Runkit이 필요 없는 단순한 서버의 웹 API부터)

실제 부호


Runkit으로 노트북을 난잡하게 만들어서 다음 코드를 복사하세요.
const express = require("@runkit/runkit/express-endpoint/1.0.0");
const bodyParser = require("body-parser");
const { createMessageAdapter } = require("@slack/interactive-messages")

const SLACK_TOKEN = 'xxxxx';

const app = express(exports);
const slackInteractions = createMessageAdapter(SLACK_TOKEN);

//
// Interactive Message の内容
// 
const interactiveButtons = (text, userName) => ({
  text: `A new polling incoming :raised_hand: by @${userName}`,
  response_type: 'in_channel',
  attachments: [
    {
      text,
      color: '#3AA3E3',
      callback_id: 'yesno_polling',
      actions: [{
        name: 'yesno_polling',
        text: 'Yes! :ok_woman:',
        value: 'yes',
        type: 'button',
        style: 'primary',
      }, {
        name: 'yesno_polling',
        text: 'No :woman-gesturing-no:',
        value: 'no',
        type: 'button',
        style: 'danger',
      }]
    }, {
      color: '#32cd32',
      title: ':ok_woman:',
      callback_id: 'yes_users',
      text: '',
    }, {
      color: '#ff0000',
      title: ':woman-gesturing-no:',
      callback_id: 'no_users',
      text: '',
    }
  ]
});

//
// *上の Interactive Message に対応するハンドラ*
// 
// 投票が被ってしまわないよう自分の既存の選択を一度リセットしたうえで再び該当する選択肢にアサインする
//
slackInteractions.action('yesno_polling', (payload, respond) => {
  const originalMessage = payload.original_message;
  const resetOwnVoting = (text, userName) => (text || '').replace(`@${userName}`, '');

  const yesUsers = 
    originalMessage.attachments[1].text =
    resetOwnVoting(originalMessage.attachments[1].text, payload.user.name);

  const noUsers = 
    originalMessage.attachments[2].text =
    resetOwnVoting(originalMessage.attachments[2].text, payload.user.name);

  switch (payload.actions[0].value) {
    case 'yes':
      originalMessage.attachments[1].text = (yesUsers + ` @${payload.user.name}`);
      break;
    case 'no':
      originalMessage.attachments[2].text = (noUsers + ` @${payload.user.name}`);
      break;
  }

  return originalMessage;
});

//
// Slash Command のリクエストハンドラ
//
const SLACK_ACTION_PATH = '/slack/actions'
const SLACK_COMMANDS_PATH = '/slack/commands'

app.use(bodyParser.urlencoded({ extended: false }));
app.use(SLACK_ACTION_PATH, slackInteractions.expressMiddleware());
app.post(SLACK_COMMANDS_PATH, (req, res, next) => {
  const pollingText = req.body.text;
  const userName = req.body.user_name;

  if (pollingText) {
    res.send(interactiveButtons(pollingText, userName));
  } else {
    res.send('_No polling text. That\'s required_');
  }
});
DB가 없다고 썼지만 실제로는 투표 결과의 문자열을 데이터 원본으로 강제로 사용했을 뿐입니다
Interactive message buttons의 자세한 사용 방법은 여기서 설명하면 어렵지 않습니다.
다만, 우선 설치slackapi/node-slack-interactive-messages에 사용하는 것이 좋다고 생각한다.이번에도 써봤는데 아주 간단하게 만들었어요.
그런 다음 Endpoint에서 Notebook을 API로 사용할 URL을 가져와 저장합니다.

응용 프로그램 만들기


Slack App 로그인 페이지부터 자신의 슬랙 앱을 만들어보자.
먼저 AppName에 원하는 이름을 지정하십시오.

Interactive Components


Interactivity를 유효성화하여 Notebook에서 얻은 API의 URL에 추가된 /slack/actions 경로의 내용을 다음 Request URL에 지정합니다.

Slash Commands


우리 프로그램이 사선 명령으로 시작할 수 있도록 합시다.
먼저 Create New Command에서 새 슬래시 명령을 생성합니다.

Command에서 슬래시 명령으로 지정할 문자열을 지정합니다.
Interactive Components가 Request URL에서 한 것처럼 Notebook에서 가져온 URL의 끝에 /slack/commands 의 내용을 추가하도록 지정합니다.

인증서 토큰 구성


Basic Information 페이지에서 인증서 토큰을 복제하고 위에 표시된 설치 코드SLACK_TOKEN로 교체하십시오.

그나저나 비밀스러운 것인데 누가 들키면 리제네레이트에서 다시 생성해.여기서 공개했으니까 이제 재생성

애플리케이션 정보 설정


검증기 영패를 받는 화면을 조금만 더 내려가면 응용 정보를 지정할 수 있다.
여기서 아이콘을 설정하면 더 멋질 수 있어요.나는 먼저 수중에 있는 퓨마의 멋진 운동화를 아이콘으로 지정했다.멋있네.

작업공간에 설치


여기까지 준비 거의 안 끝났어!!
작업공간에 바로 설치해 주세요.

시용하다

mypoll 지령을 통해 투표앱군이 투표하도록 할 수 있다.

이렇게 되면 언제나 2선 1 투표를 즐길 수 있다.

문제점


사용하면 Runkit 측에서Timeout was reached 이런 메시지를 비교적 빈번하게 받는다.실용성이라고 할 수는 없다.

좋은 웹페이지 즐겨찾기