Skip to content
Avatar de Thomas BntThomas Bnt@thomasbnt
retour
Créer un robot Discord avec les Slash Commands

Créer un robot Discord avec les Slash Commands

Modifié le
6 min de lecture · 1160 mots
This post is also available in English

INFORMATION : Ce tutoriel sert à créer un robot Discord avec des Slashs Commands.

En savoir plus sur l’utilisation des Slash CommandsFavicon de support.discord.com

⚠️ DISCLAIMER : Ce tutoriel a été rédigé en 2023 et mis à jour en 2026. discord.js et l’API Discord évoluent régulièrement (changements d’intents, dépréciations, nouvelles versions majeures) : le code présenté ici peut ne plus fonctionner tel quel dans plusieurs années. Vérifiez toujours la documentation officielle de discord.jsFavicon de discord.js.org et les changelogs de l’API DiscordFavicon de discord.com si vous rencontrez des erreurs.

📚 Pré-requis avant de se lancer

Avant de commencer ce tutoriel, suivez les consignes suivantes. Vous devez installer plusieurs outils afin que le robot fonctionne, et créez un dossier avec n’importe quel nom, de préférence court et sans espace. Ça sera votre dossier contenant vos fichiers du robot.

Liste des outils et des choses à savoir :

  • Connaitre les bases du JavaScript
  • Installer Node.js en version 18 ou supérieureFavicon de nodejs.org (requis par discord.js v14)
  • Avoir accès au terminal
  • Avoir une bonne connexion Internet
  • Un éditeur de texte ou IDE (Notepad++, Atom, WebStorm, VSCode …)
  • Savoir lire un minimum l’anglais pour les documentations

Nous allons dans un premier temps si tout a bien été installé, ouvrez votre invité de commande et non celle d’installé par Node.js (si vous êtes sous Windows), et tapez :

node --version

Il est censé vous relever la version que vous avez installée. Laissez cette fenêtre ouverte pour la suite de l’installation.

✨ Ce que nous allons réaliser pour ce tutoriel

Avant de continuer à lire la suite, vous devez comprendre que vous devez un minimum modifier certaines valeurs, comme les IDs et les noms de commandes. Nous allons réaliser un simple robot Discord avec les Slash Commands, et on verra comment synchroniser très facilement la liste de nos commandes avec l’API native de discord.js. Et pour finir, une commande exemple : /ping.

La commande ping en Slash Command

Image à titre exemplaire concernant le corps de la commande /ping

Il faut aussi noter que les packages vous sont proposés dans cet exemple de package.json avec une version fixe, n’hésitez donc pas à vérifier s’il y a une mise à jour pour chacun d’entre-eux.

🕺🏼 Installation du projet et des paquets

Après avoir correctement installé la dernière version de Node.js, vous devez vous rendre dans le dossier de votre robot. Pour se déplacer dans l’invité de commande :

cd /nomDuDossier

Pour plus de simplicité, allez dans votre dossier en naviguant avec l’interface graphique et non avec l’invité de commande et copiez l’URL en haut. Ensuite, collez-la dans l’invité de commande en ajoutant cd avant votre texte copié. Si vous n’êtes pas dans le dossier de votre robot avec l’invité de commande, veuillez revoir les lignes en haut. Nous allons installer le paquet pour que le robot marche. Ce paquet se nomme Discord.js, c’est une librairie pour faciliter à interagir avec l’API de Discord et développé sous JavaScript.

Les différents paquets

Nous aurons besoin d’un seul Node package (npm) pour que le robot fonctionne.

  • discord.jsFavicon de npmjs.com : Pour créer le robot, répondre aux messages, créer et synchroniser les Slash Commands (via SlashCommandBuilder et client.application.commands, tous deux inclus nativement, sans dépendance supplémentaire)
npm install discord.js

Exemple de package.json

Vous pouvez en soi avoir le même package.json :

{
  "name": "example_discord_bot_slash_commands",
  "version": "1.0.0",
  "main": "app.js",
  "scripts": {
    "start": "node app.js"
  },
  "keywords": [
    "discordapp",
    "bot",
    "discordjs"
  ],
  "author": "Thomas Bnt",
  "license": "GPL-3.0-only",
  "engines": {
    "node": ">=18.0.0"
  },
  "dependencies": {
    "discord.js": "^14.27.0"
  }
}

Comme vous le pouvez le lire, nous avons indiqué dans le script un fichier, app.js est le fichier où l’on va exécuter le robot.

Nous allons donc installer tous les packages :

npm install 

🤖 Création du robot sur la plateforme

Désormais, il faut créer le robot sur la plateforme de Discord et l’ajouter sur votre serveur. Pour cela, nous allons le faire en deux étapes. Suivez ce processus, vous devez être connecté à votre compte Discord afin de pouvoir accéder à cette page.

Création du robot Discord

  • Allez dans l’onglet Bot
  • Cliquez sur “Add Bot”, puis cliquez sur “Yes, do it!

Activer le 'mode' robot

Il reste plus qu’à l’ajouter sur votre propre serveur. Pour cela, il suffit juste d’aller sur l’onglet OAuth2, donnez-lui les permissions nécessaires pour le bon fonctionnement du robot, et générez votre lien.

Générer une URL Oauth2 sur Discord

Copiez-le et ouvrez-le dans un nouvel onglet, on vous demande de sélectionner un serveur. Sélectionnez le vôtre et cliquez sur Autoriser. Vous avez dorénavant votre robot qui est sur votre serveur, mais il est hors ligne. C’est tout à fait normal ! Suivez la suite afin de l’allumer.

🚀 Créer la première commande

Nous y sommes ! C’est le moment où nous allons créer notre première commande.

Le fichier principal : app.js

Après avoir correctement tout installé, vous devez créer le fichier app.js. Il vous sert tout simplement de ‘root’ de votre projet, j’aime bien l’appeler son cœur 💜. Car c’est à partir de lui que tout démarre.

Voici donc un exemple de fichier nommé app.js :

/**
 @document   : app.js
 @author     : Thomas Bnt
 @version    : 3.0.0
 @copyright  : 2023, Thomas Bnt
 @license    : GNU General Public License v3.0
 @repository : https://github.com/thomasbnt/Bord-Pi
 @description: Un robot Discord gérant et aidant les utilisateurs pour un serveur.
 */

const fs = require('fs')
const {Client, Collection, GatewayIntentBits, MessageFlags} = require('discord.js')

const client = new Client({
  // Un robot qui ne fonctionne qu'avec des Slash Commands n'a besoin
  // que de l'intent Guilds : il ne lit aucun contenu de message.
  // Si vous ajoutez plus tard des fonctionnalités basées sur les messages,
  // pensez à activer les intents nécessaires dans votre dashboard discord.dev
  // à l'adresse https://discord.com/developers/applications/{ID}/bot,
  // section "Privileged Gateway Intents"
  intents: [
    GatewayIntentBits.Guilds
  ],
})

// Nous créons une collection pour les commandes
client.commands = new Collection()
const commandFiles = fs
  .readdirSync('./commands')
  .filter((file) => file.endsWith('.js'))

for (const file of commandFiles) {
  const command = require(`./commands/${file}`)
  client.commands.set(command.data.name, command)
}

// Les events comme par exemple ready.js (quand le robot s'allume), 
// ou encore messageCreate.js (quand un utilisateur/robot envoie un message)
const eventFiles = fs
  .readdirSync('./events')
  .filter((file) => file.endsWith('.js'))

for (const file of eventFiles) {
  const event = require(`./events/${file}`)
  if (event.once) {
    client.once(event.name, (...args) => event.execute(...args, client))
  } else {
    client.on(event.name, (...args) => event.execute(...args, client))
  }
}

// L'event interactionCreate directement ici, car c'est en soit le coeur du robot.
client.on('interactionCreate', async (interaction) => {
  if (!interaction.isCommand()) return
  const command = client.commands.get(interaction.commandName)
  if (!command) return

  // On log quand un utilisateur fait une commande
  try {
    await console.log(
      `/${interaction.commandName} — Par ${interaction.user.username}`
    )
    await command.execute(interaction, client)
    // Mais s'il y a une erreur, 
    // alors on log ça et on renvoi un message d'erreur seulement à la personne (ephemeral: true)
  } catch (error) {
    console.error(error)
    return interaction.reply({
      content: "Une erreur s'est produite lors de l'exécution de cette commande !",
      flags: MessageFlags.Ephemeral,
      fetchReply: true
    })
  }
})

// Le token de votre robot à insérer
client.login("JOLI TOKEN A NE JAMAIS DIVULGER")

Synchronisation des Slash Commands

Depuis discord.js v14, la synchronisation des Slash Commands ne demande plus de module externe : la méthode .commands.set(), native à la librairie, s’en charge en un seul appel. Elle envoie l’ensemble de vos commandes à Discord, qui se charge lui-même de créer les nouvelles, modifier les commandes changées, et supprimer celles qui n’existent plus dans votre liste.

Deux façons de l’utiliser, selon le contexte :

  • client.application.commands.set(commands) : synchronisation globale, disponible sur tous les serveurs où est présent le robot. Peut prendre jusqu’à 1h pour se propager.
  • guild.commands.set(commands) : synchronisation sur un seul serveur, appliquée quasi instantanément. Pratique en développement, pour tester vos commandes sans attendre.

On va appeler cette méthode directement dans l’event Ready !

Le fichier de l’event Ready

Quand vous allumerez votre robot, à chaque fois cet event s’exécutera. Donc, nous pouvons faire en sorte de placer une fonction ou tout autre de code qui devrait s’exécuter dès le début.

const {ActivityType} = require('discord.js')
module.exports = {
  name: 'ready',
  async execute(client) {
    console.log(`Connecté en tant que ${client.user.username}`)
    client.user.setActivity(`/bord`, {type: ActivityType.Watching})

    // Le "data" de chaque commande est un SlashCommandBuilder,
    // on le convertit en JSON avant de l'envoyer à Discord.
    const commands = client.commands.map((c) => c.data.toJSON())

    // En développement : synchronisation instantanée sur un seul serveur.
    // Remplacez l'ID ci-dessous par l'ID de votre serveur de test.
    const guildId = "TonIDDeServeurOuSupprimeCetteLigne"

    if (guildId) {
      await client.guilds.cache.get(guildId)?.commands.set(commands)
    } else {
      // En production : synchronisation globale (jusqu'à 1h de propagation)
      await client.application.commands.set(commands)
    }

    console.log(`${commands.length} commande(s) synchronisée(s) !`)
  }
}

La commande /ping comme exemple

Alors, elle est basique comme commande, mais elle peut aussi être utilisée pour détecter des anomalies sur la connexion. Donc pas si inutile que ça.

const {SlashCommandBuilder, EmbedBuilder, MessageFlags} = require('discord.js')
module.exports = {
  // "data" est le corps de la commande, construit avec SlashCommandBuilder,
  // c'est ce qu'on va retrouver quand on va taper /ping
  data: new SlashCommandBuilder()
    .setName('ping')
    .setDescription('Obtenir le ping du robot'),
  // et tout ça, c'est la logique de la commande
  async execute(interaction, client) {
    // Par exemple là on créée un embed avec EmbedBuilder de discord.js
    // On lui ajoute un name et iconURL, et on va par la suite le modifier avec les valeurs.
    const PingBeforeEmbed = new EmbedBuilder().setAuthor({
      name: `L'oiseau va revenir avec le ping du robot...`,
      iconURL: client.user.avatarURL()
    })
    const sent = await interaction.reply({
      embeds: [PingBeforeEmbed],
      fetchReply: true,
      flags: MessageFlags.Ephemeral
    })
    const TotalPing = sent.createdTimestamp - interaction.createdTimestamp
    const PingEmbed = new EmbedBuilder()
      .setAuthor({
        name: `Le ping de ${client.user.username}`,
        iconURL: client.user.avatarURL()
      })
      .addFields(
        {
          name: 'Total du ping',
          value: `${TotalPing}ms`,
          inline: true
        },
        {
          name: 'Websocket',
          value: `${client.ws.ping} ms`,
          inline: true
        }
      )
    await interaction.editReply({
      embeds: [PingEmbed],
      flags: MessageFlags.Ephemeral
    })
  }
}

Ce que je devrais avoir dans mon projet

  • Créer le fichier app.js
  • Créer le dossier events/ et le fichier events/ready.js
  • Créer le dossier commands/ et le fichier commands/ping.js
.
├── app.js
├── commands
│   └── ping.js
├── events
│   └── ready.js
└── package.json

S’il vous manque quelque chose, c’est que vous n’avez pas tout lu. 😱

🥳 Démarrage du robot !

Vous devez copier le token de votre robot qui se trouve sur la page Discord pour les développeursFavicon de discord.com.

Exemple de token à recopier

Et l’insérer avec ce bout de code à la fin de votre app.js

client.login("VOTRE TOKEN ICI SANS ESPACE")

Sauvegardez votre fichier et faites cette commande dans l’invité de commande :

node app.js

Et voilà ! Votre robot est allumé ! 🎉


🎥 Streamer ?

Obtenez le script pour votre propre robot Discord afin d’avertir vos membres quand vous passez en live sur Twitch.

x

Si vous êtes un streamer, vous pouvez obtenir ce script pour avertir vos membres que vous passez en live sur Twitch. Faites savoir à votre communauté que vous passez en live sur Twitch ! Ce script est conçu pour ça, il alerte dans un salon choisi quand vous passez en live et quand vous le finissez. Il vous change aussi l’icône de votre serveur en ce que vous voulez.

Initialement publié le
Partager sur

Article Précédent
Créer son site web sous Nuxt v3 et Netlify
Article Suivant
Comment tester l'API de DEV (Forem)