Slack message APIを用いたGithub issue作成ショートカット

#Slack message APIを用いてGithub issue作成をslackのmessageからできるようにします
slackを業務上でのチャットツールとして使用しているので、version管理で使用しているgithubへのissue作成をslack上でのやり取りから直接行えるようにしたくて開発しました。
実装してみたところ、かなり利便性が高いと思ったので、共有したいと思います。
基本的部分はslackのmessage APIのチュートリアルから引用しています。[Slack チュートリアル](https://api.slack.com/lang/ja-jp/actions "message-API")
**前提条件: 今回作成するアプリはnode.js環境が必要なため、ブラウザ上でnode環境を構築できるGlitchを使用します**
glitchのコードはこのリンク https://glitch.com/edit/#!/slack-create-issue-pub から "remix" してください。Glitch の remix とは、GitHub の fork のような機能で、リミックスしたコードは自分のリポジトリとなりますので、好きなように書き換える事ができます。
後は.envファイルに自分のkeyを入力し、自分のgithubを入力するだけで、使えるようになります。


前半のAPIの設定はこのチュートリアル部分と全く同じです。
まずは[Slack App Management](https://api.slack.com/apps)から`Create New APP`をクリックして次の画面を表示させます。
App Nameは今回は`create a github issue`、Work placeは自分がアプリを適用させたいワークスペースを選択してください。
![スクリーンショット 2020-11-11 10.43.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754958/dfe849ad-854a-b788-ec56-cc3931835637.png)
次に Basic Information の App Credentials セクションまでスクロールします。ここにはアプリの API 認証キーがいくつかがありますが、このチュートリアルでは Signing Secret を使います。

![スクリーンショット 2020-11-11 10.50.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754958/866258cd-305a-2dfc-82fe-4f00ff453482.png)
この Signing Secret は隠されている状態ですが、まずそれを表示させ、その値を Node アプリのルートにある `.env` ファイルに 環境変数 SLACK_SIGNING_SECRET として保存します。このシークレットキーの使い方についてはのちの 「リクエスト情報の認証 」セクションで説明します。
`SLACK_SIGNING_SECRET=15770a…`
もう少し下にスクロールしていくと **Display Information** がありますのでそこでアプリのアイコンや詳細など編集することができます。 
次に、左のメニューから **Interactive Components** をクリックして、そのページトップになる Interactivity をオンにしてください。するとフィールドが表示されます。
![スクリーンショット 2020-11-11 11.18.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754958/55028f97-56b5-6304-d9fe-71adc2b51036.png)
ここでは Request URL を入力します。このリクエスト URL とは、ユーザーがアクション機能を呼び出した際に Slack の API サーバーから送信されるペイロードデータの受け取り場所となる URL と考えてください。
**注：**この URL はあなたのアプリが稼働しているサーバーの URL となりますが、ここでは Glitch を使っていますので、リクエスト URL は　` https://my-project.glitch.me/actions` のようになります。
Request URL を設定し終わったら、**Shortcuts**までスクロールし、`Create New Shortcut` ボタンをクリックして、`On message`を選択して次のフォームを表示します。

![スクリーンショット 2020-11-11 11.31.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754958/bd0a9eab-a6e0-d1f5-6428-0e9026a86042.png)
**Details** の**Action-name**に`create-issue-by-glitch`,**short description**に`create an issue thorough message short cut`、**Callback ID**に`create-issue`を入力してcreateしてください。

他の項目は比較的自由ですが、`Callback ID`は変更したらglitchのコードを変更する必要があるので、変更しないことをお薦めします。
Create ボタンを押し、次に場面で Save Changes をクリックしてください。

次は **OAuth & Permissions** へ行き **Install App to Workspace** をクリックして一旦このアプリをインストールします。インストール画面が表示されますのでそのまま続行し、ワークスペースにインストールしてください。終わってから OAuth & Permission ページに戻ると access tokens が表示されていますのでそれを取得します。トークンは他のキー同様、 .env ファイルに保存します。`SLACK_ACCESS_TOKEN=xoxb-214…`
次に、同じページ内でパーミションスコープを有効にする必要があります。下にスクロールして Scopes セクションまで行き、必要な bot スコープを追加します。ここでは次の二つの権限設定が必要です：
`Add on a OAuth Scope`から次の２つを追加して、**Tokens for Your Workspace**にある`Reinstall App`をクリックしてください。
`commands` メッセージ・アクションに必要な権限
`chat:write` メッセージを送信するのに必要な権限
![スクリーンショット 2020-11-11 11.51.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754958/1162778f-0d3b-b32a-189b-883f6d23e961.png)
これでSlack内でのAppの設定は完了です。
最後は冒頭のリンク　https://glitch.com/edit/#!/slack-create-issue-pub からremixしたアプリに.envに`Github Access Token`を入力して`gitissue.js`の`git-owner`に自分のユーザー名、
`git-repo`にissueを作成したいrepository名を入力してください。そして`.env`の`GLITCH_DEBUGGER`の値に`true`を入力して完了です。

```js:gitissue.js
octokit.issues.create({
    owner: 'git-owner',//ここにowner名　git-owner
    repo: 'git-repo',//ここにrepo名　git-repo
    title: initialdatas.title,
    body: initialdatas.body,
  }).then(({data}) => {
    console.log(data);
  }).catch(error => {
    console.log(error);
  }); 
```
これで最初に設定したワークプレイスでメッセージショートカットが使用でき、issue作成まで行えるようになっていると思います。

アプリのコード解説はこちらのページに書いています。
https://qiita.com/takaya787/items/9e74acd6b0b4f67bb4fd