Slack Bot提交报错“连接故障，请重试”问题求助（Socket Mode）

核心问题 #

你当前使用的是Slack已废弃的Dialog API（dialog.open），却试图用新的app.views处理提交——两套系统完全不兼容，直接导致提交时Slack找不到对应处理逻辑，弹出连接错误。另外，命令响应逻辑不符合Slack要求：ack()调用晚于API请求，可能触发超时。

修复步骤 #

1. 替换为Views模态框API：用views.open替代dialog.open，并调整模态框结构（Views使用blocks定义界面元素，字段格式与Dialog不同）。
2. 提前ack命令请求：Slack要求命令必须在3秒内完成ack，因此要先调用await ack()，再打开模态框。
3. 添加Views提交处理器：用app.views.submission监听模态框提交事件，及时ack提交请求并处理数据。

修改后的完整代码 #

app.command("/bugreport", async ({ command, ack, client }) => {
  try {
    // 先ack命令请求，避免超时
    await ack();
    
    // 用Views API打开模态框
    await client.views.open({
      trigger_id: command.trigger_id,
      view: {
        type: "modal",
        callback_id: "bug-report",
        title: {
          type: "plain_text",
          text: "Make an issue"
        },
        submit: {
          type: "plain_text",
          text: "Request"
        },
        close: {
          type: "plain_text",
          text: "Cancel"
        },
        blocks: [
          // 姓名输入框
          {
            type: "input",
            block_id: "username_block",
            label: {
              type: "plain_text",
              text: "Your Name"
            },
            element: {
              type: "plain_text_input",
              action_id: "username_input",
              placeholder: {
                type: "plain_text",
                text: "Enter your name"
              }
            }
          },
          // 严重程度选择框
          {
            type: "input",
            block_id: "severity_block",
            label: {
              type: "plain_text",
              text: "Issue Severity"
            },
            element: {
              type: "static_select",
              action_id: "severity_select",
              options: [
                {
                  text: { type: "plain_text", text: "Minor" },
                  value: "minor"
                },
                {
                  text: { type: "plain_text", text: "Moderate" },
                  value: "moderate"
                },
                {
                  text: { type: "plain_text", text: "Urgent" },
                  value: "urgent"
                },
                {
                  text: { type: "plain_text", text: "Critical" },
                  value: "critical"
                }
              ]
            }
          },
          // 描述输入框
          {
            type: "input",
            block_id: "description_block",
            label: {
              type: "plain_text",
              text: "Description"
            },
            element: {
              type: "plain_text_input",
              action_id: "description_input",
              multiline: true,
              placeholder: {
                type: "plain_text",
                text: "Describe the bug thoroughly"
              },
              hint: {
                type: "plain_text",
                text: "Be thorough and explain the exact cause of the bug"
              }
            }
          },
          // Bug时间线
          {
            type: "input",
            block_id: "timeline_block",
            label: {
              type: "plain_text",
              text: "Bug timeline"
            },
            element: {
              type: "plain_text_input",
              action_id: "timeline_input",
              placeholder: {
                type: "plain_text",
                text: "When did this issue first appear"
              }
            }
          },
          // 预期行为
          {
            type: "input",
            block_id: "expected_block",
            label: {
              type: "plain_text",
              text: "Expected Behaviour"
            },
            element: {
              type: "plain_text_input",
              action_id: "expected_input",
              multiline: true,
              hint: {
                type: "plain_text",
                text: "Detail what you expected the code to do"
              }
            }
          },
          // 实际行为
          {
            type: "input",
            block_id: "actual_block",
            label: {
              type: "plain_text",
              text: "Actual Behaviour"
            },
            element: {
              type: "plain_text_input",
              action_id: "actual_input",
              multiline: true,
              hint: {
                type: "plain_text",
                text: "What actually happened, what was different"
              }
            }
          },
          // 复现步骤
          {
            type: "input",
            block_id: "steps_block",
            label: {
              type: "plain_text",
              text: "Steps to reproduce"
            },
            element: {
              type: "plain_text_input",
              action_id: "steps_input",
              multiline: true,
              placeholder: {
                type: "plain_text",
                text: "1. [First Step]\n2. [Second Step]\n3. [And so on]"
              }
            }
          },
          // 额外信息
          {
            type: "input",
            block_id: "additional_block",
            label: {
              type: "plain_text",
              text: "Additional Information"
            },
            element: {
              type: "plain_text_input",
              action_id: "additional_input",
              multiline: true,
              hint: {
                type: "plain_text",
                text: "Anything extra to include"
              }
            }
          }
        ]
      }
    });
  } catch (error) {
    console.error("Error opening modal:", error);
  }
});

// 处理模态框提交
app.views.submission("bug-report", async ({ view, ack, say }) => {
  try {
    // 必须先ack提交请求，避免Slack报错
    await ack();
    
    // 提取表单数据
    const values = view.state.values;
    const username = values.username_block.username_input.value;
    const severity = values.severity_block.severity_select.selected_option.value;
    const description = values.description_block.description_input.value;
    const timeline = values.timeline_block.timeline_input.value;
    const expected = values.expected_block.expected_input.value;
    const actual = values.actual_block.actual_input.value;
    const steps = values.steps_block.steps_input.value;
    const additional = values.additional_block.additional_input.value;
    
    // 这里可以添加处理逻辑，比如发送到Issue系统、通知频道等
    await say(`收到新的Bug报告：\n提交人：${username}\n严重程度：${severity}\n描述：${description}`);
  } catch (error) {
    console.error("Error handling submission:", error);
  }
});

关键说明 #

• Views模态框是Slack当前支持的标准模态框方案，Dialog API已被官方标记为废弃，不再维护。
• 所有Slack交互事件（命令、视图提交）都必须在3秒内ack，否则会触发超时错误，因此ack()要优先调用。
• app.views.submission通过callback_id匹配对应的模态框提交事件，必须实现这个处理器来完成提交流程。

内容的提问来源于stack exchange，提问作者SashimiDude