This article was originally written by Muhammed Ali on the Honeybadger Developer Blog.

Discord is a platform that enables people to talk over voice, video, and text, as well as hang out with their friends and communities. Discord provides a way to section different groups of people with Server/Guild.

In this article, you will learn how to use some features provided by Discord API. We will begin by explaining how to set up Discord OAuth2 for authentication, followed by building a simple discord bot and attaching it to some servers, and finally, displaying the servers where the bot is attached on the frontend.

When working with Discord, a lot of functionality will need to be handled asynchronously because Discord uses WebSockets to build real-time communication between the Discord API and the application. With that said, we will have to use a version of Flask that handle asynchronous requests perfectly Quart.

You can find the full project on GitHub.

Prerequisites

• Basic knowledge of Python and Flask.
• Python installed.
• Discord account and about five servers created.

Authenticate Discord with OAuth2

Later in this article, we will be building something like a dashboard where you can see all the servers that have your bot attached to it. You may not want everyone to be able to access that page, so you can use the OAuth2 system provided by Discord.

To do this, go to the Discord developer portal, and ***on the Discord developer portal page, click the “New Application*” button in the top right corner. Then, fill in the “Name” field and submit.

Next, click the OAuth2 dropdown and then click the Add Redirect button. This is where you will add the URL that will handle the redirect after authentication. The URL we will be using for the redirect is http://127.0.0.1:5000/callback. Also, take note of the CLIENT ID and CLIENT SECRET because we will need them in the code.

Set OAuth2 callback URL

On the OAuth2 dropdown, click the URL Generator tab and select the scope that you see on the image below. Then, copy the URL generated. This URL will be used to connect the bot to the server.

URL generator page

Open the URL on the browser, select the server you want to connect the bot to it, and submit all the redirects.

Now, let’s install the dependencies with the following command.

pip install quart quart-discord discord-ext-ipc discord

Building the Authentication System

First, create a new file with name main.py and paste the following code. The code below is initializing the credentials and routes required to authenticate with Discord.

from quart import Quart, render_template, redirect, url_for
from quart_discord import DiscordOAuth2Session
import os

os.environ[
    "OAUTHLIB_INSECURE_TRANSPORT"
] = "1"  # this is required because OAuth 2 utilizes https.

app = Quart(__name__)

app.config["SECRET_KEY"] = "test123"

app.config["DISCORD_CLIENT_ID"] = 969522874446671953  # Discord client ID.
app.config[
    "DISCORD_CLIENT_SECRET"
] = "dfp9GSgUHqvIMBSEIsrG9DW1XMnJskhl"  # Discord client secret.
app.config[
    "DISCORD_REDIRECT_URI"
] = "http://127.0.0.1:5000/callback"  # URL to your callback endpoint.

discord = DiscordOAuth2Session(app) #handle session for authentication

@app.route("/")
async def home():
    return await render_template("home.html", authorized=await discord.authorized)

@app.route("/login")
async def login():
    return await discord.create_session() # handles session creation for authentication

@app.route("/callback")
async def callback():
    try:
        await discord.callback()
    except Exception:
        pass

    return redirect(url_for("dashboard")) #dashboard function will be  created later in the a

Remember the credentials I told you to take note of earlier? You will need to input them in the code above. If you are building a real-world project, you will need to make sure to keep those credentials secure.

If you notice in the code above, we used a file home.html; this is the page that the will handle the authentication button. In the same folder where main.py is located, create a new directory and file templates/home.html and paste the code below.

<!DOCTYPE html>
<html>
<head>
    <title>Home Page</title>
</head>
<body>
<h1>Welcome to the Home page!</h1>

Click here to login:
<a href="/login"><button>Login with discord</button></a>

</body>
</html>

Creating the Discord Bot

In this section, we will be creating a simple bot that says, “Hello There!”, when it is pinged. To accomplish this, we will use two tools that we installed earlier: discord-ext-ipc and discord. discord is a Discord library for Python, and discord-ext-ipc provides a server for bot services.

Start by creating a file named bot.py and paste the following code. The code below sends "Hello there!" anytime it is pinged.

import discord
from discord.ext import commands, ipc

class MyBot(commands.Bot):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.ipc = ipc.Server(self, secret_key="this_is_secret") #used tonnect ipc server to other servers

    async def on_ready(self):
        """Called upon the READY event"""
        print("Bot is ready.")

    async def on_ipc_ready(self):
        """Called upon the IPC Server being ready"""
        print("Ipc server is ready.")

    async def on_ipc_error(self, endpoint, error):
        """Called upon an error being raised within an IPC route"""
        print(endpoint, "raised", error)

my_bot = MyBot(command_prefix="$", intents=discord.Intents.default()) #prefix to ping the bot

@my_bot.command()
async def hello(ctx): 
    await ctx.send("Hello there!") # response from the bot when you send $hello

my_bot.ipc.start()
my_bot.run("OTY5NTIyODc0NDQ2NjcxOTUz.Ymuoig.OMsQ8sCsk5pY1cJSdn5yyDB8Bhc")

For the bot to work, you need to get the bot token from the Discord developer portal, in the Bot tab.

Get Discord bot token

Building the Dashboard

To build the dashboard, we need write functions in bot.py to get the number of guilds where the bot is present and the guild IDs of the guilds where the bot is present. We need the guild IDs for the bot so that we can match it with the list of all user guilds that we get in the application (main.py), and then display the guild’s details where they match.

You can do this by pasting the following code above my_bot.ipc.start() in your bot.py file.

@my_bot.ipc.route()
async def get_guild_count(data):
    return len(my_bot.guilds)  # returns the len of the guilds to the client

@my_bot.ipc.route()
async def get_guild_ids(data):
    final = []
    for guild in my_bot.guilds:
        final.append(guild.id)
    return final  # returns the guild ids where the bot is

Now we need to write the function for the dashboard in the main.py file. Paste the following code, below in callback().

@app.route("/dashboard")
async def dashboard():
    guild_count = await ipc_client.request("get_guild_count") # get func we created aearlier for guild count
    guild_ids = await ipc_client.request("get_guild_ids") # get func we created aearlier for guild IDs

    try:
        user_guilds = await discord.fetch_guilds() # fetch data for user's guilds
        user = await discord.fetch_user() #fetch data for user
    except:
        return redirect(url_for("login")) # redirect to login page if user is not logged in

    same_guilds = []

    for guild in user_guilds:
        if guild.id in guild_ids:
            same_guilds.append(guild)

    return await render_template(
        "dashboard.html", guild_count=guild_count, matching=same_guilds, user=user
    )

if __name__ == "__main__":
    app.run(debug=True)

Then add the code below to the top of the main.py file.

from discord.ext import ipc 

ipc_client = ipc.Client(
    secret_key="this_is_token"
)  # secret_key must be the same as your IPC server

You may have noticed in dashboard() that we are rendering a template (dashboard.html) we have not created.

Create a new file with the name dashboard.html in templates/ and paste the following code.

<!DOCTYPE html>
<html>
<head>
    <title>Dashboard</title>
</head>
<body>
  <h3>Hello, {{user.name}}! Please select a server to get started</h3>

<h2> The Bot is in: {{guild_count}} servers </h2>

<h3> Bot's guilds </h3>

<ul>
{% for guild in matching %}
<img src="{{guild.icon_url}}"  />
  <li>{{ guild.name }}</li>
  <br><br>
{% endfor %}
</ul>

</body>
</html>

Testing

To begin, let’s start the server for the bot and the application. You can start the server for the bot by running python bot.py, and you can start the app on another command-line window with python main.py. Now go to Discord and select one of the guilds/servers to which you attached the bot, and you will notice on the top right that your bot is active. Ping the bot by texting “$hello”, and you should get “Hello There!” as the response.

Output from the whole code

You can test the application by going to localhost for Flask; hit the login button to log in, and then you will be redirected to the dashboard.

Dashboard display

Conclusion

In this article, you’ve learned how to use each feature provided by Discord API. First, we learned how to set up Discord OAuth2 for authentication. Then, we built a simple discord bot and attached it to some servers/guilds. Finally, we displayed the servers where we attached the bot on the frontend.

You may have noticed that in the tutorial, I didn’t pay attention to the design of the application. This could be where you can improve from where I left off. Of course, you can always improve on the complexity of the bot as needed.

Finally, please remember to always secure your Discord credentials.