Discord.js按钮/选择菜单触发Unknown interaction(10062)报错求助

使用discord.js开发Discord机器人时，点击嵌入消息（embed）上的按钮或选择菜单会随机触发DiscordAPIError[10062]: Unknown interaction错误。推测可能是交互响应超时导致，但不确定修复方法。已经在交互开头调用了interaction.deferReply()，并用interaction.update()更新消息，尝试过将i.update()改为i.editReply()但出现其他错误，寻求解决方案。

报错信息 #

/workspaces/miru/node_modules/@discordjs/rest/dist/index.js:722
      throw new DiscordAPIError(data, "code" in data ? data.code : data.error, status, method, url, requestData);
            ^

DiscordAPIError[10062]: Unknown interaction
    at handleErrors (/workspaces/miru/node_modules/@discordjs/rest/dist/index.js:722:13)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async BurstHandler.runRequest (/workspaces/miru/node_modules/@discordjs/rest/dist/index.js:826:23)
    at async _REST.request (/workspaces/miru/node_modules/@discordjs/rest/dist/index.js:1266:22)
    at async StringSelectMenuInteraction.update (/workspaces/miru/node_modules/discord.js/src/structures/interfaces/InteractionResponses.js:233:5)
    at async InteractionCollector.<anonymous> (/workspaces/miru/commands/lists/list.js:156:9) {
  requestBody: {
    files: [],
    json: {
      type: 7,
      data: {
        content: undefined,
        tts: false,
        nonce: undefined,
        embeds: [
          {
            title: '5-toubun no Hanayome Movie',
            url: 'https://myanimelist.net/anime/48548',
            author: [Object],
            thumbnail: [Object],
            color: 16759283,
            fields: [Array],
            footer: [Object],
            timestamp: '2024-04-12T15:10:25.952Z'
          }
        ],
        components: undefined,
        username: undefined,
        avatar_url: undefined,
        allowed_mentions: undefined,
        flags: undefined,
        message_reference: undefined,
        attachments: undefined,
        sticker_ids: undefined,
        thread_name: undefined
      }
    }
  },
  rawError: { message: 'Unknown interaction', code: 10062 },
  code: 10062,
  status: 404,
  method: 'POST',
  url: 'https://discord.com/api/v10/interactions/1228361679293644890/aW50ZXJhY3Rpb246MTIyODM2MTY3OTI5MzY0NDg5MDpkQWhGNzNmcmEwZmZYZ2FvY1FobGxZbnJwYklKWEtYdVRnbzkzb3hlcmZaYWlxZVFLNzQzcUtmSGY1WVo1b1diRHIwZUVDMEhjYzJGR2ZZbFpVRmdDOTlTZm02cmdacTFuM21JQ1lFRWV3SjFDdmNDS0hEdjl3dXNIeGdqYVY5YQ/callback'
}

相关代码 #

选择菜单与按钮收集器 #

const collector = interaction.channel.createMessageComponentCollector({ time: 900000 });

collector.on('collect', async i => {
  if (i.customId === 'select_anime') {
    currentIndex = parseInt(i.values[0]);
    await i.update({ embeds: [embeds[currentIndex]] });
  } else if (['previous', 'next'].includes(i.customId)) {
    await i.update({ embeds: [embeds[currentIndex]] });
  } else if (['prev_menu', 'next_menu'].includes(i.customId)) {
    if (i.customId === 'prev_menu' && currentMenuIndex > 0) {
      currentMenuIndex--;
    } else if (i.customId === 'next_menu' && currentMenuIndex < chunkedAnimeList.length - 1) {
      currentMenuIndex++;
    }
    rowSelectMenu.setComponents(createSelectMenu(chunkedAnimeList[currentMenuIndex], currentMenuIndex));
    menuNavigationButtons.setComponents(createMenuNavigationButtons().components);
    await i.update({ components: [rowSelectMenu, menuNavigationButtons] });
  }
});

interaction.deferReply()调用代码 #

async execute(interaction) {
    await interaction.deferReply();

初始消息发送逻辑 #

// Send the initial message
await interaction.editReply({
  embeds: [embeds[currentIndex]],
  components: [rowSelectMenu, menuNavigationButtons]
});

解决方案 #

1. 为每个组件交互单独延迟响应 #

每个按钮/菜单点击都是独立的新交互，必须在3秒内给出响应（包括延迟响应）。在收集器的处理逻辑前添加延迟响应，避免Discord判定交互超时：

collector.on('collect', async i => {
  try {
    // 延迟响应，告知Discord正在处理
    await i.deferUpdate();
    
    if (i.customId === 'select_anime') {
      currentIndex = parseInt(i.values[0]);
      await i.editReply({ embeds: [embeds[currentIndex]] });
    } else if (['previous', 'next'].includes(i.customId)) {
      await i.editReply({ embeds: [embeds[currentIndex]] });
    } else if (['prev_menu', 'next_menu'].includes(i.customId)) {
      if (i.customId === 'prev_menu' && currentMenuIndex > 0) {
        currentMenuIndex--;
      } else if (i.customId === 'next_menu' && currentMenuIndex < chunkedAnimeList.length - 1) {
        currentMenuIndex++;
      }
      rowSelectMenu.setComponents(createSelectMenu(chunkedAnimeList[currentMenuIndex], currentMenuIndex));
      menuNavigationButtons.setComponents(createMenuNavigationButtons().components);
      await i.editReply({ components: [rowSelectMenu, menuNavigationButtons] });
    }
  } catch (error) {
    console.error('组件交互处理失败:', error);
    // 处理交互过期的情况
    if (error.code === 10062) {
      await i.followUp({ content: '交互已超时，请重新操作', ephemeral: true }).catch(() => {});
    }
  }
});

2. 绑定收集器到指定消息 #

当前使用的频道级收集器会监听频道内所有组件交互，可能误触其他消息的组件。改为绑定到初始回复的消息，只监听目标消息的交互：

// 发送初始回复后，获取回复消息对象
const replyMessage = await interaction.editReply({
  embeds: [embeds[currentIndex]],
  components: [rowSelectMenu, menuNavigationButtons]
});

// 基于回复消息创建收集器
const collector = replyMessage.createMessageComponentCollector({ time: 900000 });

3. 优化耗时逻辑 #

检查收集器回调内的代码是否有耗时操作（如API请求、大数据处理），尽量异步化或优化性能，确保在3秒内完成核心逻辑，避免交互过期。

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