slack - 应用程序教程中的 Workflow Builder 步骤：提供故障代码的服务器端问题

问题描述

我正在关注来自应用程序的 Workflow Builder Steps 教程： https ://api.slack.com/tutorials/workflow-builder-steps

故障模板： https ://glitch.com/edit/#!/steps-from-apps

我无法验证 Slack 中的重定向 URL，我认为这是因为我在重新混合代码后立即在 glitch.com 上看到了服务器端错误。

错误信息：

ReferenceError: require is not defined

file:///app/index.js:1
const { App, WorkflowStep } = require("@slack/bolt");
ReferenceError: require is not defined
Jump Toat file:///app/index.js:1:31
at ModuleJob.run (internal/modules/esm/module_job.js:152:23)
at async Loader.import (internal/modules/esm/loader.js:166:24)
at async Object.loadESM (internal/process/esm_loader.js:68:5)

故障： https ://glitch.com/edit/#!/tarry-tremendous-walnut

有什么想法吗？

谢谢！

瑞克

index.js：

const { App, WorkflowStep } = require("@slack/bolt");

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

// This code saves tasks to this object
// Tasks are stored in memory and not in a persistent database
// This object is refreshed each time your Glitch app restarts
// The result is that your App Home will be cleared with each restart
let TASKS_DB = {};

const ws = new WorkflowStep("copy_review", {
  edit: async ({ ack, step, configure }) => {
    await ack();

    const blocks = [
      {
        type: "section",
        block_id: "intro-section",
        text: {
          type: "plain_text",
          text:
            "Create a task in one of the listed projects. The link to the task and other details will be available as variable data in later steps.",
          emoji: true
        }
      },
      {
        type: "input",
        block_id: "task_name_input",
        element: {
          type: "plain_text_input",
          action_id: "name",
          placeholder: {
            type: "plain_text",
            text: "Write a task name"
          }
        },
        label: {
          type: "plain_text",
          text: "Task name",
          emoji: true
        }
      },
      {
        type: "input",
        block_id: "task_description_input",
        element: {
          type: "plain_text_input",
          action_id: "description",
          placeholder: {
            type: "plain_text",
            text: "Write a description for your task"
          }
        },
        label: {
          type: "plain_text",
          text: "Task description",
          emoji: true
        }
      },
      {
        type: "input",
        block_id: "task_author_input",
        element: {
          type: "plain_text_input",
          action_id: "author",
          placeholder: {
            type: "plain_text",
            text: "Write a task name"
          }
        },
        label: {
          type: "plain_text",
          text: "Task author",
          emoji: true
        }
      }
    ];

    await configure({ blocks });
  },
  save: async ({ ack, step, update, view }) => {
    await ack();

    const {
      task_name_input,
      task_description_input,
      task_author_input
    } = view.state.values;

    const taskName = task_name_input.name.value;
    const taskDescription = task_description_input.description.value;
    const taskAuthorEmail = task_author_input.author.value;

    const inputs = {
      taskName: { value: taskName },
      taskDescription: { value: taskDescription },
      taskAuthorEmail: { value: taskAuthorEmail }
    };

    const outputs = [
      {
        type: "text",
        name: "taskName",
        label: "Task Name"
      },
      {
        type: "text",
        name: "taskDescription",
        label: "Task Description"
      },
      {
        type: "text",
        name: "taskAuthorEmail",
        label: "Task Author Email"
      }
    ];

    await update({ inputs, outputs });
  },
  execute: async ({ step, complete, fail, client }) => {
    try {
      const { taskName, taskDescription, taskAuthorEmail } = step.inputs;

      const outputs = {
        taskName: taskName.value,
        taskDescription: taskDescription.value,
        taskAuthorEmail: taskAuthorEmail.value
      };

      const user = await client.users.lookupByEmail({
        email: taskAuthorEmail.value
      });

      const userId = user.user.id;

      const newTask = {
        task_name: taskName.value,
        task_description: taskDescription.value
      };

      TASKS_DB[userId] = TASKS_DB[userId]
        ? [...TASKS_DB[userId], newTask]
        : [newTask];

      const taskBlocksItems = TASKS_DB[userId].map(task => {
        return [
          {
            type: "section",
            text: {
              type: "plain_text",
              text: task.task_name,
              emoji: true
            }
          },
          {
            type: "divider"
          }
        ];
      });

      const homeHeader = [
        {
          type: "header",
          text: {
            type: "plain_text",
            text: "Workflow Builder - Steps from Apps task list",
            emoji: true
          }
        },
        {
          type: "context",
          elements: [
            {
              type: "mrkdwn",
              text:
                "_This is a list of tasks generated by your example Workflow Builder Task creation step, found in this tutorial https://api.slack.com/tutorials/workflow-builder-steps. These tasks are stored in the Glitch client, not in a database and refresh every time your Glitch app is restarted. If you'd like to store these tasks in a database, please check out this Glitch page for more information https://glitch.com/@storage _"
            }
          ]
        },
        {
          type: "divider"
        }
      ];
      const taskBlocks = [].concat.apply([], taskBlocksItems);

      const blocks = homeHeader.concat(taskBlocks);

      // update app home
      let view = {
        type: "home",
        blocks
      };

      const usersTasks = TASKS_DB[userId];

      await client.views.publish({
        user_id: userId,
        view: JSON.stringify(view)
      });

      // If everything was successful, complete the step
      await complete({ outputs });
    } catch (e) {
      // TODO if something went wrong, fail the step ...
      app.logger.error("Error completing step", e.message);
    }
  }
});

app.step(ws);

(async () => {
  // Start your app
  const port = process.env.PORT || 3000;
  await app.start(port);

  console.log(`⚡️ index.js Bolt app is running on port ${port}!`);
})();

标签： slackslack-apiglitch-framework

slack - 应用程序教程中的 Workflow Builder 步骤：提供故障代码的服务器端问题

问题描述

解决方案

推荐阅读