Discord.js v14按钮点击显示交互失败但功能正常的问题求助

问题原因 #

你遇到的“interaction failed”提示，核心原因是没有对按钮触发的交互进行响应。Discord API要求所有组件（按钮、选择菜单等）交互必须在3秒内得到回复（包括延迟回复），否则就会触发这个错误。你的代码里虽然正常更新了队列和Embed，但漏掉了对按钮交互的响应步骤，所以才会出现计数正常但报错的情况。

修复方案 #

在collect事件处理函数中添加交互响应，同时统一使用Discord.js v14推荐的EmbedBuilder替代混用的MessageEmbed，修改后的完整代码如下：

const { SlashCommandBuilder, EmbedBuilder } = require('@discordjs/builders');
const { ActionRowBuilder, ButtonBuilder, ButtonStyle } = require('discord.js');

module.exports = {
  data: new SlashCommandBuilder()
    .setName('queue')
    .setDescription('Starts a queue for Valorant custom games.'),
  async execute(interaction) {

    const MAX_QUEUE_SIZE = 10;
    const queue = [];

    const joinButton = new ButtonBuilder()
      .setCustomId('joinQueue')
      .setLabel('Join Queue')
      .setStyle(ButtonStyle.Primary)
      .setDisabled(false);

    const queueEmbed = new EmbedBuilder()
      .setTitle('Valorant Custom Game Queue')
      .setDescription(`Current Queue Size: ${queue.length}/${MAX_QUEUE_SIZE}`);

    const queueMessage = await interaction.reply({
      embeds: [queueEmbed],
      components: [new ActionRowBuilder().addComponents(joinButton)],
      fetchReply: true,
    });

    const collector = queueMessage.createMessageComponentCollector({
      filter: (i) => i.customId === 'joinQueue' && !queue.includes(i.user.id),
      time: 60000,
    });

    collector.on('collect', async (buttonInteraction) => {
      // 关键修复：先响应按钮交互，避免超时报错
      await buttonInteraction.deferUpdate();

      queue.push(buttonInteraction.user.id);

      if (queue.length >= MAX_QUEUE_SIZE) {
        joinButton.setDisabled(true);
      }

      queueEmbed.setDescription(`Current Queue Size: ${queue.length}/${MAX_QUEUE_SIZE}`);
      await queueMessage.edit({
        embeds: [queueEmbed],
        components: [new ActionRowBuilder().addComponents(joinButton)],
      });
    });

    collector.on('end', async () => {
      const queuedPlayers = queue.map(id => `<@${id}>`).join('\n');

      const fullEmbed = new EmbedBuilder()
        .setTitle('Valorant Custom Game Queue')
        .setDescription(`Queue is now full with ${queue.length} players!`)
        .addField('Queued Players:', queuedPlayers || 'No players joined');

      if (queue.length === MAX_QUEUE_SIZE) {
        await queueMessage.edit({
          embeds: [fullEmbed],
          components: [],
        });

        queue.length = 0;
      }
    });
  }
};

关键修改点说明 #

1. 添加交互响应：在collect事件里调用await buttonInteraction.deferUpdate()，告诉Discord我们会更新原消息，不需要发送新回复，这样就不会触发超时错误。如果想给用户单独提示，也可以用await buttonInteraction.reply({ ephemeral: true, content: '成功加入队列！' })，这个回复只有点击按钮的用户能看到。
2. 统一Embed构造器：把原来的MessageEmbed换成EmbedBuilder，这是Discord.js v14的标准用法，避免版本兼容问题。
3. 优化玩家列表显示：用<@${id}>把用户ID转换成@提及格式，让队列玩家列表更直观。

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