Slackのコマンドでdialogを表示して、編集したデータをgasで加工したい。

Question

やりたいこと

日報を集計するアプリをslack内で作りたいのですが、ダイアログを表示段階で手こずってます。

1. Slackで、/日報と入力
2. 編集用のボタンが表示

3. 「書く」ボタンをクリックするとdialogが表示
4. 送信をクリックしたらデータを受け取る
5. 受け取ったデータをもとにデータを加工してslackに投稿、スプレットシートに入力

やったこと

1. slackで新規アプリを作りました
2. Slash Commandsを登録しました
3. コマンドで実行するコードをgasで作りました
4. GASをWEB公開して、Slash CommandsのリクエストURLに反映
5. ボタンの表示を確認した
6. ダイアログのコードをgasで作りました
7. GASをWEB公開して、Interactive ComponentsのリクエストURLに上記のURLを反映
8. slackで実行したが、ボタン押しても反応がない。

Slash Commandsに登録したGASのJS

function doPost(e) {

  var btn = {
    "text": "日報を書きますか？",
    "attachments": [
      {
        "fallback": "Sorry, no support for buttons.",
        "callback_id": "sendBtn",
        "color": "#3AA3E3",
        "attachment_type": "default",
        "actions": [
          {
            "name": "edit",
            "text": "書く",
            "type": "button",
            "value": "true"
          },
          {
            "name": "edit",
            "text": "キャンセル",
            "type": "button",
            "value": "false"
          }
        ]
      }
    ]
  }

  return ContentService.createTextOutput(JSON.stringify(btn)).setMimeType(ContentService.MimeType.JSON);
}

Interactive Componentsに登録したGASのJS

function doPost(e) {
  var trigger_id = e.parameter.trigger_id;
  var slackUrl = "https://slack.com/api/dialog.open";
  var SLACK_OAUTH_ACCESS_TOKEN = PropertiesService.getScriptProperties().getProperty("SLACK_OAUTH_ACCESS_TOKEN");

  var dialog = {
    "token": SLACK_OAUTH_ACCESS_TOKEN, // OAuth_token
    "trigger_id": trigger_id,
    "dialog": JSON.stringify({
      "callback_id": "dialog",
      "title": "日報を書いてください",
      "submit_label": "送信する",
      "elements": [
        {
          "type": "text",
          "label": "テスト",
          "name": "test"
        },
      ]
    })
  };

  var options = {
    'method' : 'post',
    'payload' : dialog
  }; 

  UrlFetchApp.fetch(slackUrl, options);
  return ContentService.createTextOutput();
  
}

お聞きしたいこと

現コードの間違いがあれば、お聞きしたいです。
また、どのようにすればダイアログを表示できるのか、アドバイスいただけないでしょうか？

Answer 1

trigger_id を取得できていないのだと思います。

var trigger_id = e.parameter.trigger_id;

ではなく、

var data = e.parameter.payload;
var json = JSON.parse(data);
var trigger_id = json.trigger_id;

としたら、ダイアログが表示されないでしょうか？？

Answer 2

elementsの最後にあるカンマが原因かも。

Comments

[kumakuma112]

ここ掲載する際に誤って入れてしまったものでした。
取ってもやはり動かないです。