Passi per costruire e distribuire un bot Discord

In questo articolo, costruiremo e distribuiremo un bot Discord utilizzando Node.js, la libreria ufficiale discord.js e i container Back4app.

I bot di Discord sono programmi che eseguono attività automatizzate su Discord. Questi bot possono interagire con gli utenti, gestire la condotta della comunità e fornire funzionalità extra non disponibili su Discord per impostazione predefinita, come la riproduzione di musica, la moderazione dei contenuti, l’organizzazione di sondaggi e l’integrazione con servizi esterni o API.

Impostazione dell’ambiente di sviluppo

Questo articolo presenta un bot Discord che fornisce agli utenti domande di curiosità a cui rispondere in base al livello di difficoltà preferito e al tipo di domanda su un server Discord.

Per seguire questa esercitazione, è necessario disporre di quanto segue:

• Un account Discord: Se non ne avete uno, potete iscrivervi gratuitamente.
• Node.js v20 o superiore: Se non lo si possiede, è possibile scaricarlo e installarlo sul proprio sistema.

Per impostare la directory del progetto, eseguire il comando seguente:

mkdir discord-bot && cd discord-bot && npm init -y

Il comando precedente crea una cartella discord-bot e inizializza npm al suo interno.

Quindi, navigare nel file package.json e aggiungere lo script di avvio qui sotto:

"start": "node server.js"

Quindi, installare le dipendenze necessarie per il progetto eseguendo il comando seguente:

npm install discord.js axios dotenv 

Le dipendenze installate in precedenza includono le seguenti:

• discord.js: questa libreria consente di interagire con l’API Discord dalla propria applicazione Node.js.
• dotenv: questo pacchetto aiuta a gestire dati sensibili come il token del bot.
• axios: Questo pacchetto consente di richiedere l’API Trivia.

Ora avete configurato l’ambiente di sviluppo e installato le dipendenze necessarie. Successivamente, si creerà un account per il bot Discord.

Creare un account bot Discord

Un account Bot Discord è un account Discord creato per gestire un bot. A differenza degli account utente normali, controllati dagli utenti umani, il software controlla gli account bot.

Questo account fungerà da gateway, concedendo al bot le autorizzazioni necessarie per accedere alle risorse del server, rispondere agli eventi ed eseguire azioni all’interno della comunità Discord.

Per creare un account bot Discord è necessario creare un’applicazione Discord. Per crearne una, accedere al portale degli sviluppatori di Discord e fare clic sul pulsante “Crea applicazione”, come mostrato nell’immagine seguente.

Facendo clic sul pulsante si richiede di accedere al proprio account Discord. Dopo aver effettuato l’accesso, assegnare un nome all’applicazione e fare clic sul pulsante “Crea”, come mostrato nell’immagine seguente.

Quindi, disattivare l’interruttore del bot pubblico per garantire che solo voi possiate aggiungere il vostro bot ai server.

Quindi, configurare le autorizzazioni del bot disattivando tutti gli “Intenti privilegiati del gateway” per garantire che abbia accesso agli aggiornamenti in tempo reale sull’attività del server, come la presenza dei membri.

Successivamente, passare alla scheda “OAuth2” nella barra laterale sinistra. Nella sezione “SCOPES”, spuntate le caselle bot e application.commands, come mostrato nell’immagine seguente.

La selezione dell’ambito bot consente a Discord di riconoscere l’applicazione come bot, mentre l’ambito application.commands consente di creare comandi slash che il bot ascolterà.

Quando si seleziona la casella di controllo del bot, si apre la sezione “PERMESSI BOT”. Nella sezione “PERMESSI BOT”, selezionare la casella di controllo Amministratore, come mostrato nell’immagine seguente.

Selezionando questa casella di controllo, il bot ottiene tutti i permessi possibili all’interno del server. Questi permessi includono la possibilità di gestire messaggi e canali.

Sotto la sezione “PERMESSI BOT”, Discord genererà un URL per aggiungere il bot a un server. Incollare l’URL nel browser web e scegliere il server a cui aggiungere il bot.

Successivamente, nella scheda “bot” si ottiene il token del bot facendo clic sul pulsante“Reset Token“, come mostrato nell’immagine seguente.

Facendo clic sul pulsante per la prima volta, si ripristina il token predefinito del bot e si ottiene un nuovo token. Copiare e conservare il token in modo sicuro. Se si perde il token, è necessario reimpostarlo di nuovo, poiché viene visualizzato una sola volta.

Creare un file .env per aggiungere le variabili d’ambiente, come il token del bot, insieme ad altri dati, come l ‘ID della gilda a cui si è aggiunto il bot e l’ID del client del bot:

TOKEN = "<BOT TOKEN>"
GUILD_ID = "<GUILD ID>"
CLIENT_ID = "<BOT'S CLIENT ID>"

Ora avete configurato il vostro account Discord Bot. Successivamente, si costruirà il bot Discord.

Costruire il progetto del bot Discord con Node.js

Questa sezione vi guiderà nella creazione del vostro bot per quiz Discord e nell’integrazione dei pacchetti installati per registrare i comandi slash del bot con Discord e gestire l’interazione del bot con un membro della gilda.

Per seguire questa guida, strutturate la cartella del vostro progetto in modo simile a quella qui sotto.

quiz-bot/
│
├── src/
│   ├── register-commands.js   # Script to register slash commands with Discord
│   └── quiz-bot.js                # Script for message handling and fetching questions
│
├── server.js                  # Entry point for your bot and script for running a server
├── node_modules/              # Node.js modules
│
├── .env                       
├── .gitignore                   
├── package.json                         
└── package-lock.json

Registrazione dei comandi bot

I bot richiedono agli utenti di inserire un comando. Con i bot Discord, si definiscono i comandi che si desidera ascoltare con il prefisso slash (/).

Per registrare il comando /quiz del bot sul server Discord, aggiungere innanzitutto le seguenti importazioni da discord.js al file register-commands.js:

// register-commands.js
const { REST, Routes, ApplicationCommandOptionType } = require('discord.js');

Le classi importate sopra includono le seguenti:

• REST: Questa classe consente di effettuare chiamate API REST all’API di Discord.
• Percorsi: Questa classe fornisce funzioni di utilità che generano endpoint dell’API di Discord.
• ApplicationCommandOptionType: Questa classe consente di definire i tipi di dati per le opzioni accettate dal comando.

Successivamente, è necessario definire un array di oggetti comando che contengono tutti i comandi del bot. Un oggetto comando contiene un nome, una descrizione e un array di opzioni.

Queste opzioni consentono agli utenti di personalizzare il comando del bot. In questo caso, l’array di opzioni consentirà agli utenti di specificare la difficoltà e il tipo di domanda che il quiz bot dovrà porre.

Aggiungere il blocco di codice sottostante al file register-commands.js per creare l’array di comandi:

// register-commands.js
const commands = [
  {
    name: 'quiz',
    description:
      'Select difficulty and question type to tailor the quiz experience.',
    options: [
      {
        type: ApplicationCommandOptionType.String,
        name: 'difficulty',
        description: "Options include 'easy', 'medium', or 'hard'.",
        required: true,
      },
      {
        type: ApplicationCommandOptionType.String,
        name: 'type',
        description:
          " Choose 'multiple' for multiple choice or 'boolean' for true/false",
        required: true,
      },
    ],
  },
];

Il blocco di codice precedente definisce il comando quiz nell’array dei comandi. L’oggetto quiz contiene due opzioni che l’utente deve inserire insieme al comando /quiz, come il livello di difficoltà e il tipo di domanda che il bot porrà.

Successivamente, è necessario registrare il comando /quiz per renderlo accessibile attraverso il bot. Per registrare il comando, occorre innanzitutto creare un’istanza della classe REST con il token del bot discord e la versione REST preferita.

Per registrare il comando /quiz e renderlo accessibile attraverso il bot, iniziare a creare un’istanza della classe REST utilizzando il token del bot Discord e specificando la versione REST preferita.

Così:

// register-commands.js
const rest = new REST({ version: '10' }).setToken(process.env.TOKEN);

Discord aggiorna regolarmente la propria API, con conseguenti modifiche agli endpoint, alla struttura delle risposte e al comportamento.

La definizione di una versione REST specifica per il progetto Discord consente di gestire efficacemente le funzionalità disponibili per il progetto. Il blocco di codice qui sopra utilizza la versione 10 dell’API di Discord.

Successivamente, è necessario definire una funzione asincrona per registrare i comandi del bot con il server della gilda, utilizzando il metodo applicationGuildCommands della classe Routes.

Così:

// register-commands.js
(async () => {
  try {
    console.log('Started refreshing SLASH (/) commands.');
    await rest.put(
      Routes.applicationGuildCommands(
        process.env.CLIENT_ID,
        process.env.GUILD_ID
      ),
      { body: commands }
    );
    console.log('Successfully reloaded SLASH (/) commands.');
  } catch (error) {
    console.error(error);
  }
})();

Il blocco di codice precedente esegue una richiesta PUT all’endpoint dell’API Discord con l’array di comandi come corpo della richiesta.

Costruisce l’endpoint dell’API usando il metodo applicationGuildCommands, inserendo l’ID del client del bot e l’ID della gilda di destinazione.

Dopo aver registrato i comandi, sarà necessario gestire il flusso di interazione tra il bot e un membro della gilda.

Gestire l’interazione dell’utente con il bot Discord

Per gestire il flusso di interazione tra il bot e un membro della gilda, per prima cosa aggiungete le seguenti importazioni al file quiz-bot.js:

// quiz-bot.js
const { Client, IntentsBitField } = require('discord.js');
const axios = require('axios');

È necessario utilizzare la classe Client per creare una nuova istanza di bot Discord, mentre si utilizzerà la classe IntentsBitField per specificare gli intenti (eventi) che il bot riceverà dall’API Discord.

Quindi, aggiungere il blocco di codice qui sotto nel file quiz-bot.js per creare una nuova istanza client per il bot e specificare gli intenti particolari dell’applicazione bot:

// quiz-bot.js
const client = new Client({
  intents: [
    IntentsBitField.Flags.Guilds,
    IntentsBitField.Flags.GuildMembers,
    IntentsBitField.Flags.GuildMessages,
    IntentsBitField.Flags.MessageContent,
  ],
});

Il blocco di codice precedente definisce gli intenti specifici di cui il bot ha bisogno per funzionare, che includono:

• IntentsBitField.Flags.Guilds: Questo intento consente al bot di ricevere informazioni sulle gilde (server) di cui è membro, compresi i nomi, le icone e i ruoli.

• IntentsBitField.Flags.GuildMembers: Questo intento consente al bot di ricevere informazioni sui membri della gilda, come i loro nomi utente, stati e ruoli.

• IntentsBitField.Flags.GuildMessages: Questo intento garantisce al bot l’accesso ai messaggi inviati nelle gilde in cui si trova, consentendogli di rispondere ai comandi o agli eventi attivati dai messaggi.

• IntentsBitField.Flags.MessageContent: Questo intento consente al bot di accedere al contenuto effettivo dei messaggi inviati nelle gilde. Senza questo intento, il contenuto dei messaggi sarà vuoto.

Si creerà un ascoltatore di eventi per l’evento ready. Questo evento si attiva quando il bot Discord si è connesso con successo ai server Discord ed è pronto a funzionare.

Aggiungete il blocco di codice sottostante al file quiz-bot.js per creare l’ascoltatore dell’evento ready:

// quiz-bot.js
client.on('ready', () => {
  console.log(`✅ Bot is online and ready`);
});

Successivamente, è necessario creare un ascoltatore di eventi per l’evento interactionCreate. Questo evento si verifica quando un utente esegue un’interazione che il bot può gestire, come ad esempio l’uso di un comando slash.

Quando viene emesso, l’ascoltatore di eventi riceverà l’evento interactionCreate insieme a un oggetto interazione.

Questo oggetto include tutti i dettagli dell’interazione, come il tipo di interazione e i dati forniti dall’utente.

Aggiungete il blocco di codice sottostante al file quiz-bot.js per creare l’ascoltatore dell’evento interactionCreate:

// quiz-bot.js
client.on('interactionCreate', async (interaction) => {
 if (!interaction.isChatInputCommand()) return;
 
 if (interaction.commandName === 'quiz') {
  // Rest of the code goes here...
 }
});

Il blocco di codice precedente imposta un ascoltatore dell’evento interactionCreate.

L’ascoltatore di eventi controlla se l’interazione tra l’utente e il bot è un comando di chat (comando slash) e filtra altri tipi di interazioni.

Quindi controlla se il commandName è quiz e procede a gestire la sessione di quiz tra il bot e l’utente.

Se il commandName è quiz, fare una richiesta GET con Axios all’URL dell’API Trivia per ottenere la domanda e le relative risposte (corrette e non corrette).

Mescolare le risposte per randomizzare le opzioni, quindi renderle all’utente.

Così:

// quiz-bot.js

await interaction.deferReply();

const difficulty = interaction.options.getString("difficulty");
const type = interaction.options.getString("type");

try {
  const url = `https://opentdb.com/api.php?amount=1&difficulty=${difficulty}&type=${type}`;
  const response = await axios.get(url);
  const data = response.data.results[0];
  const question = data.question;
  const correctAnswer = data.correct_answer;
  const options = [...data.incorrect_answers, correctAnswer];

  // Shuffle the options
  for (let i = options.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [options[i], options[j]] = [options[j], options[i]];
  }

  await interaction.editReply({
    content: `Question: ${question}\\nOptions: ${options.join(", ")}`,
  });
} catch (error) {
  console.error(error);
  // Notify the user in case of an error after deferring
  await interaction.followUp("Failed to fetch the question. Please try again.");
}

Il blocco di codice precedente rinvia innanzitutto la risposta del bot con il metodo deferReply, per consentire al bot un certo intervallo di tempo per gestire la richiesta GET.

Il blocco di codice recupera quindi la difficoltà e il tipo di domanda selezionati dall’utente dall’oggetto interazione, utilizzando interaction.options.getString().

Successivamente, il bot estrae la domanda, la risposta corretta e le risposte errate dai dati recuperati.

Dopo aver mescolato le risposte corrette e quelle errate per randomizzare l’ordine di scelta, modifica la risposta differita iniziale con la domanda e le opzioni del quiz.

Successivamente, è necessario gestire la risposta dell’utente alla domanda, confrontandola con la risposta corretta e informando l’utente se è corretta o sbagliata.

Raccolta delle risposte degli utenti

Per raccogliere la risposta dell’utente alla domanda, si utilizzerà il metodo createMessageCollector sul canale dell’interazione(interaction.channel).

Questo metodo consente di filtrare i messaggi non inviati dall’utente che ha avviato il comando /quiz, di impostare un limite di tempo per la risposta dell’utente e di specificare il numero massimo di messaggi da raccogliere.

Quando l’utente invia una risposta, il metodo createMessageCollector attiva un evento collect.

È necessario aggiungere un ascoltatore a questo evento; l’ascoltatore controllerà la risposta dell’utente rispetto alla risposta corretta alla domanda e invierà un messaggio appropriato.

D’altra parte, se l’utente non invia una risposta appropriata entro il limite di tempo specificato, il metodo createMessageCollector attiverà un evento di fine.

È necessario aggiungere un ascoltatore che risponda all’utente per notificargli che il suo tempo è scaduto per questo evento.

Così:

// quiz-bot.js
const filter = (m) => m.author.id === interaction.user.id;

const collector = interaction.channel.createMessageCollector({
  filter,
  time: 15000,
  max: 1,
});

collector.on("collect", async (m) => {
  if (m.content.toLowerCase() === correctAnswer.toLowerCase()) {
    await m.reply("Correct answer! 🎉");
  } else {
    await m.reply(`Wrong answer! The correct answer was: ${correctAnswer}`);
  }
});

collector.on("end", (collected) => {
  if (collected.size === 0) {
    interaction.followUp("Time is up! No answer was provided.");
  }
});

Il blocco di codice precedente crea un raccoglitore di messaggi per il canale in cui è avvenuta l’interazione(collector). collector filtrerà i messaggi in base all’ID dell’autore, assicurando che solo l’utente che ha avviato il quiz possa fornire una risposta entro un limite di tempo di 15 secondi.

Il blocco di codice crea quindi due ascoltatori di eventi per collector. Il primo ascoltatore di eventi, collect, attiverà una callback per verificare la risposta dell’utente e rispondere all’utente di conseguenza.

Il secondo ascoltatore di eventi, end, attiverà una callback per notificare all’utente che non ha fornito una risposta entro il tempo limite.

Quindi, stabilire una connessione tra il bot e Discord aggiungendo la riga di codice alla fine del file quiz-bot.js:

// quiz-bot.js
client.login(process.env.TOKEN);

Creazione di un file di inserimento

Si creerà un file di ingresso, un singolo file che inizializzerà l’intera applicazione bot. Avrà due funzioni:

• Importare la logica del bot: Il file di inserimento eseguirà la logica del bot richiedendo i file JavaScript, che gestiscono la registrazione del comando del bot con il server Discord e la risposta ai messaggi degli utenti.

• Avvio del server: Il file di ingresso imposterà un server che consentirà al bot di essere eseguito su un contenitore Back4app. I contenitori Back4app richiedono porte esposte affinché la distribuzione dell’applicazione abbia successo.

Aggiungere il blocco di codice sottostante al file server.js per creare un server:

// server.js
require('dotenv').config();
const http = require('http');
require('./src/register-commands.js');
require('./src/quiz-bot.js');

http
  .createServer((req, res) => {
    res.writeHead(200, { 'Content-Type': 'text/plain' });
    res.end('Bot is running!');
  })
  .listen(3000, () => {
    console.log('Server is ready.');
  });

Il blocco di codice precedente configura il bot Discord per funzionare creando un semplice server HTTP. Questo server funge da punto di ingresso, consentendo al bot di funzionare all’interno dell’ambiente del contenitore.

Il blocco di codice precedente importa la logica di base del bot e specifica una porta Back4app per consentire al bot di essere distribuito su un contenitore Back4app.

Dopo aver creato il file di ingresso, è possibile testare il bot Discord localmente prima di distribuirlo in un contenitore Back4app.

Testare il bot Discord

Avviate il vostro bot Discord eseguendo il blocco di codice sottostante nel terminale della vostra applicazione:

node server.js

Il comando registrerà i messaggi che indicano che la registrazione del bot è avvenuta con successo e che il bot è pronto e online.

Andare al server a cui è stato aggiunto il bot. Si dovrebbe notare che ora è online.

Per interagire con il bot, inviare il comando /quiz. Il bot dovrebbe rispondere con opzioni che spiegano come si vuole che sia la domanda del quiz.

Scegliere le opzioni desiderate (ad esempio, selezionare una categoria di quiz o un livello di difficoltà) e premere Invio. Il bot risponderà con una domanda e fisserà un limite di tempo di 15 secondi per la risposta.

Se si invia la risposta entro il tempo limite, il bot confronta la risposta con quella corretta e risponde per notificare se la risposta è giusta o sbagliata.

Avete stabilito che il vostro bot è in grado di gestire tutte le funzioni per cui lo avete progettato; quindi, distribuite il vostro bot Discord in un container Back4app.

Distribuzione del bot Discord su contenitori Back4app con l’agente AI

In questa sezione, si distribuirà il bot Discord su container Back4app con l’agente AI Back4app.

Per distribuire un’applicazione sui contenitori Back4app, è necessario quanto segue:

• Un file Docker nel progetto
• Repository GitHub: Il progetto deve essere caricato su un repository GitHub.
• App Back4app GitHub: Installare e concedere i permessi necessari all’applicazione Back4app GitHub per il proprio repository.

Per prima cosa, creare un file Docker nella cartella principale del progetto e aggiungervi il blocco di codice sottostante:

# Dockerfile
FROM node:18-alpine

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

EXPOSE 3000

CMD ["npm", "start"]

Successivamente, è necessario caricare il codice su un repository GitHub per renderlo accessibile per la distribuzione.

Prima di seguire il passo successivo, assicuratevi di aver installato l’app GitHub di Back4App Containers sul vostro account GitHub e assicuratevi che abbia i permessi necessari per accedere all’app che volete distribuire.

Andate alla homepage di Back4app e fate clic sul pulsante “Nuova app” nell’angolo in alto a destra dello schermo.

Si aprirà una schermata di inizializzazione, in cui si dovrà scegliere il tipo di applicazione che si desidera creare.

Selezionare l’opzione Back4app Agent, come mostrato nell’immagine seguente.

Quando si seleziona l’opzione Back4app Agent, si viene reindirizzati alla pagina dell’agente Back4app AI.

Dare all’agente AI il seguente prompt per distribuire l’applicazione:

Deploy my "YOUR_REPOSITORY_URL" repository on GitHub to a Back4App Container.
Here are the required environmental variables:
TOKEN = "YOUR_DISCORD_BOT_TOKEN"
GUILD_ID = "YOUR_GUILD_ID"
CLIENT_ID = "YOUR_CLIENT_ID"

Sostituite i segnaposto nel prompt qui sopra con i loro valori reali.

Si dovrebbe ottenere una risposta simile a quella riportata di seguito:

La risposta di cui sopra indica che il processo di distribuzione è in corso e che l’applicazione sarà online e disponibile nell’URL fornito.

È possibile monitorare il processo di distribuzione sulla dashboard dei contenitori Back4app, oppure si può dare all’agente AI la richiesta qui sotto dopo un po’ di tempo per confermare lo stato di distribuzione corrente.

What is the current deployment status of my web app?

Si dovrebbe ottenere una risposta simile a quella riportata di seguito:

In alternativa, potete scegliere di distribuire manualmente la vostra applicazione su Back4App.

Conclusione

In questo articolo avete imparato a costruire un bot Discord con Node.js. Si è visto come creare un account per il bot Discord, registrare i comandi del bot e gestire le risposte degli utenti.

Inoltre, avete testato il vostro bot Discord e lo avete distribuito su un container Back4app con l’aiuto dell’agente AI.

I bot di Discord possono essere molto utili per automatizzare le attività, fornire intrattenimento, ecc. e, in base al caso d’uso, è possibile modificare il bot per eseguire funzioni specifiche che soddisfino le proprie esigenze.

Il codice completo utilizzato in questa esercitazione è disponibile su questo repository GitHub.