Discord.js 实现按钮式计时器：ON/OFF 时间差计算教程-js教程-PHP中文网

Discord.js 实现按钮式计时器：ON/OFF 时间差计算教程

本文详解如何使用 Discord.js v14 构建带 ON/OFF 按钮的交互式计时器，通过 Date.now() 精确记录毫秒时间戳，并安全计算、格式化运行时长，同时规避异步回复未 await 导致的错误。

本文详解如何使用 discord.js v14 构建带 on/off 按钮的交互式计时器，通过 date.now() 精确记录毫秒时间戳，并安全计算、格式化运行时长，同时规避异步回复未 await 导致的错误。

在 Discord Bot 开发中，实现一个简洁可靠的按钮计时器（如“启动/停止”倒计时或任务耗时统计）是常见需求。你提供的代码逻辑基本正确，但存在两个关键优化点：时间精度问题与异步错误风险。下面我们将逐步重构并完善该功能。

✅ 推荐实践：使用 `Date.now()` 替代 `new Date()`

Date.now() 直接返回自 Unix 纪元起的毫秒数（number 类型），避免了 new Date() 创建对象带来的轻微开销，更重要的是——它天然支持数值运算，无需额外 .getTime() 调用，语义更清晰、性能更优：

dmap-jsapi-skill

DMap GL地图JSAPI（dmapgl）开发指南。用于编写、审查、调试 DMap 地图 API 代码，涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。

下载

let timerStart = null;
let timerEnd = null;

collector.on('collect', async (interaction) => {
  try {
    if (interaction.customId === 'onButton') {
      timerStart = Date.now();
      await interaction.reply({ content: '✅ Timer started!', ephemeral: true });
    } else if (interaction.customId === 'offButton') {
      timerEnd = Date.now();

      if (timerStart === null) {
        await interaction.reply({ content: '⚠️ Timer not started yet! Click "ON" first.', ephemeral: true });
        return;
      }

      const elapsedMs = timerEnd - timerStart;
      const seconds = Math.floor(elapsedMs / 1000);
      const minutes = Math.floor(seconds / 60);
      const remainingSeconds = seconds % 60;

      const formattedTime = minutes > 0 
        ? `${minutes}m ${remainingSeconds}s` 
        : `${seconds}s`;

      await interaction.reply({
        content: `⏹️ Timer stopped!\n⏱️ Elapsed time: **${formattedTime}** (${elapsedMs} ms)`,
        ephemeral: true,
      });

      collector.stop(); // 明确终止收集器
    }
  } catch (error) {
    console.error('Interaction reply failed:', error);
    await interaction.followUp({ content: '❌ An error occurred while processing your request.', ephemeral: true });
  }
});

⚠️ 关键注意事项

务必 await 所有 interaction.reply() / interaction.followUp()：Discord 的交互响应是 Promise，未 await 可能导致「Unknown Interaction」错误或静默失败；
初始化状态为 null：显式区分“未点击”和“0 时间戳”，避免 0 值误判（如 timerStart === 0 在 Date.now() 中合法但罕见，而 null 更语义明确）；
添加防错处理：检查 timerStart 是否存在、捕获异常并提供用户友好提示；
清理与终止：调用 collector.stop() 后，end 事件会自动触发，可在此统一禁用按钮或更新消息状态：

collector.on('end', (_, reason) => {
  message.edit({
    content: reason === 'time' 
      ? '⏰ Timer session expired (60s timeout).' 
      : '✅ Timer session completed.',
    components: [], // 移除所有按钮，防止重复点击
  });
});