
Discord is moving its API more and more towards event-based interactions (webhooks) 
rather than relying on always-on connections (websockets). This is good news as 
the internet becomes increasingly serverless, but presents a new challenge for us serverless 
developers since guides on how to navigate the new APIs are still slim.

Fear not! **In this article, we'll use Napkin to demystify how to set up a 
webhook-based slash command on Discord**. To make things more interesting, our 
bot will actually do something cool: show us the current location of 
the International Space Station!

Here's how the bot interaction will look on Discord when we're done.

![ISS Bot Demo](/images/blog/20211114/iss_bot_interaction.gif)

Want to skip ahead to the final code? You can check it out and fork it by 
following the links below. Or, continue on as we set everything up step-by-step.

[Register Slash Command](https://www.napkin.io/n/4816e451cd1d4166)

**Discord Bot Code**
- [Python Version](https://www.napkin.io/n/ed3ee69ae2fc496f)
- [Javascript Version](https://www.napkin.io/n/5873c6a0dddb4dcb)

[(Bonus) ISS Map Function](https://www.napkin.io/n/61bb5e0bab3848a3)

Still here? Awesome! 😄 Let's get started.

## Initial Setup

First, we'll create a new Application in the Discord Developer Portal. Head over
to [https://discord.com/developers/applications](https://discord.com/developers/applications) 
and click "New Application" in the top right.

Next we'll add a Bot to our application. Go to `Settings > Bot`, 
create a new one, and enable the Message Content Intent (seen at the bottom).

![Bot Configuration](/images/blog/20211114/discord_application_portal.png)

Lastly, copy the bot's Token by clicking the `Copy` button. We'll need it 
for the next step.

![Bot Token Copy Button](/images/blog/20211114/build-a-bot.png)

Now we have to register a slash command for our new application. To do that, we
have to send a HTTP request to the Discord API. You can fork [this Napkin function](https://www.napkin.io/n/4816e451cd1d4166) 
to do that - just copy in your Application ID and Bot Token and run it. For 
more details on registering commands, check out [Discord's official docs](https://discord.com/developers/docs/intro).

OK. Let's see what we have so far

**Done**
- Application created 
- Bot created and configured
- Slash command registered

**Still To Do**
- Write the code
- Point our Application's webhook URL to our Napkin function

## Writing the Code

Head over to [napkin.io/dashboard/new](https://napkin.io/dashboard/new) and 
create a new Python function **(for Javascript, see 
the [example code here](https://www.napkin.io/n/5873c6a0dddb4dcb))**.

To start, we'll write the logic to verify Discord's security signatures. Discord 
uses these signatures to ensure that your bot is capable of identifying legit 
requests from Discord and denying unauthorized requests from evildoers on the internet.

Discord doesn't mess around here. It will actually try to trick your bot by sending 
bad signatures from time to time. If your bot fails to deny those requests, Discord 
takes it offline.

In order to verify those security signatures, Discord recommends using a 
popular crypto library like [PyNacl](https://pypi.org/project/PyNaCl/), so we'll do just that. Let's also throw in the rest of the imports we'll need while we're at it.

```python
from napkin import request, response
import os
import uuid
from nacl.signing import VerifyKey 
from nacl.exceptions import BadSignatureError
```

OK, now the verification part which trips a lot of people (maybe just me) up. We'll 
use the `nacl` module to verify the contents of the the request header sent from 
Discord. If it's invalid, we respond with a `401` status. If it's valid, 
we do our bot thing 🤖

```python
# you can find your application public key at
# https://discord.com/developers/applications/<my_app_id>/information
PUBLIC_KEY = os.environ['DISCORD_PUBLIC_KEY']

# The code below handles Discord's verification check for webhook-based interactions.
# To read more about the Discord API's security requirements, see:
# https://discord.com/developers/docs/interactions/receiving-and-responding#security-and-authorization
verify_key = VerifyKey(bytes.fromhex(PUBLIC_KEY))
signature = request.headers["X-Signature-Ed25519"]
timestamp = request.headers["X-Signature-Timestamp"]
body = request.body

message = message = timestamp.encode() + request.data.encode()
try: 
    verify_key.verify(message, bytes.fromhex(signature))
    # If we get here without a BadSignatureError, we're good!
    response.status_code = 200

		# response logic to go here...
except BadSignatureError:
    # In this case, we failed verification due to one of the following:
    # -----------------------------------------------------------------
    # - Discord is testing our bot to make sure we fail invalid signatures
    # - An unauthorized request is being made to our bot from somewhere on the internet
    response.status_code = 401
    response.body = "Bad Signature"
```

Remember how I mentioned Discord sends requests to your bot just to ensure 
it does verification properly? It does that via a certain type of HTTP request 
that the API Reference calls a PING request. Request types from Discord are 
marked in the request JSON body's `type` field. According to the docs, if we 
receive a request where `type` equals 1, it's a PING request, and we should 
respond with a simple JSON object containing `{"type": 1}` to acknowledge it.

```python
# https://discord.com/developers/docs/interactions/receiving-and-responding
if body["type"] == 1: # type 1 is a Discord verification check (PING)
	response.body = {'type': 1}
```

With that code added, we can now set our webhook URL in the developer portal!

## Set the Webhook URL
Make sure your code is deployed, then copy the function URL. Go back to the 
Discord Developer Portal and paste the URL under 
`General Information > Interactions Endpoint URL`. Save changes and Discord
 will test our bot to make sure it verifies signatures correctly. You should see 
 a confirmation message.

 ![Bot Verified Confirmation](/images/blog/20211114/verification_confirmation.png)

 We can actually go to our Napkin function logs and see that Discord has performed
  the test. Go to your function's Event Logs and you should see 1 or more PING 
  requests from Discord. If they really wanted to test you, you might even see 
  them sending a bad signature in one of the requests and your function responding
  with a `401`.

![Successful PING Request](/images/blog/20211114/response_success.png)*Succesful PING request*

![Failed PING Request](/images/blog/20211114/response_fail.png)*Failed verification. Nice try, Discord.*


OK. Time for the final piece. The actual slash command response. 
It's actually super simple.

```python
if body["type"] == 1: # type 1 is a Discord verification check
    response.body = {'type': 1}
    
elif body["type"] == 2: # type 2 is a slash command interaction
    response.body = {
        "type": 4, # type 4 = CHANNEL_MESSAGE_WITH_SOURCE
        "data": {
            "embeds": [{
                "title": ":red_circle: Current ISS Location",
                "image": {
                    # add a random uuid argument to prevent Discord from caching image
                    # You can see and fork the iss-map code at 
                    # https://www.napkin.io/n/61bb5e0bab3848a3
                    "url": f"https://napkin-examples.npkn.net/iss-map?id={uuid.uuid4()}"
                }
            }]
        }
    }
```

In the interest of [separation of concerns](https://en.wikipedia.org/wiki/Separation_of_concerns), 
I've split the code that plots the 
position of the ISS into a separate function called `iss-map`. If you're interested 
in how that code works, feel free to check it out and fork it [here](https://www.napkin.io/n/61bb5e0bab3848a3)!  As for the bot 
code, we simply include the iss-map function URL as part of the embed in our 
response message.

The final code for the bot should now look like this.

```python
from napkin import request, response
import os
import uuid
from nacl.signing import VerifyKey 
from nacl.exceptions import BadSignatureError 

# you can find your application public key at
# https://discord.com/developers/applications/<my_app_id>/information
PUBLIC_KEY = os.environ['DISCORD_PUBLIC_KEY']

# The code below handles Discord's verification check for webhook-based interactions.
# To read more about the Discord API's security requirements, see:
# https://discord.com/developers/docs/interactions/receiving-and-responding#security-and-authorization
verify_key = VerifyKey(bytes.fromhex(PUBLIC_KEY))
signature = request.headers["X-Signature-Ed25519"]
timestamp = request.headers["X-Signature-Timestamp"]
body = request.body

message = message = timestamp.encode() + request.data.encode()
try: 
    verify_key.verify(message, bytes.fromhex(signature))
    # If we get here without a BadSignatureError, we're good!
    response.status_code = 200

    # what we do now depends on the Interaction Type that Discord sends
    # https://discord.com/developers/docs/interactions/receiving-and-responding
    if body["type"] == 1: # type 1 is a Discord verification check
        response.body = {'type': 1}
    
    elif body["type"] == 2: # type 2 is a slash command interaction
        response.body = {
            "type": 4, # type 4 = CHANNEL_MESSAGE_WITH_SOURCE
            "data": {
                "embeds": [{
                    "title": ":red_circle: Current ISS Location",
                    "image": {
                        # add a random uuid argument to prevent Discord from caching image
                        # You can see and fork the iss-map code at 
                        # https://www.napkin.io/n/61bb5e0bab3848a3
                        "url": f"https://napkin-examples.npkn.net/iss-map?id={uuid.uuid4()}"
                    }
                }]
            }
        }
except BadSignatureError:
    # In this case, we failed verification due to one of the following:
    # -----------------------------------------------------------------
    # - Discord is testing our bot to make sure we fail invalid signatures
    # - An unauthorized request is being made to our bot from somewhere on the internet
    response.status_code = 401
    response.body = "Bad Signature"
```

Now hit "Deploy", head over to Discord, and try it out!

![ISS Bot Demo](/images/blog/20211114/iss_bot_interaction.gif)

Have more questions? Other examples you want to see? 
[Let us know on (where else?) our Discord!](http://discord.gg/VZ2wpsnAHu)

Happy building 🛰️


Use Discord's webhook-based API to build a custom slash command

Nick Sypteras

Build a Discord Bot to Track the ISS with Napkin


If you've used Ethereum, you've paid [Gas](https://ethereum.org/en/developers/docs/gas/) to 
execute your transaction on the blockchain. And if you've paid Gas, you probably know that
 it can be very expensive. In fact, the average ethereum transaction fee 
 [has been bouncing around $30 USD over the past couple months](https://bitinfocharts.com/comparison/ethereum-transactionfees.html#3m). 

Ideally, we want to execute transactions when the Gas price is reasonably low. 
But how can we know when that is?

In this tutorial, we'll be using Napkin to build a Gas Price Monitor to constantly 
check the price of Gas on the blockchain, and alert us when it's a good time to buy those 
[precious JPEGs](https://preview.redd.it/xu8hy2j9lb071.gif?format=mp4&s=33b7ff071391e5823b64e138bfad616f41fe52e7). 
Specifically we'll be utilizing the free [Etherscan API](https://docs.etherscan.io/api-endpoints/gas-tracker#get-gas-oracle) 
to check Gas prices and the [Discord API](https://discord.com/developers/docs/intro) to send 
us an alert on Discord.

Shoutout to Kevin Yang of [Anzo Creative](https://www.anzocreative.com/), who's been 
using this method himself to monitor Gas prices and was kind enough to share his idea 
for this tutorial.

## Creating a Discord Webhook
To create a webhook URL, open your desired Discord server 
and navigate to Server Settings > Integrations > Webhooks > New Webhook.

![discord settings integrations](/images/blog/20211028/discord-integrations.png)


![discord settings integrations](/images/blog/20211028/discord-integrations-webhooks.png)


## Etherscan API Key

To obtain an Etherscan API key, simply create a free profile at 
[etherscan.io](etherscan.io) and create a key at https://etherscan.io/myapikey.


## Coding the Monitor Function
To start off, head on over to [napkin.io/dashboard/new](napkin.io/dashboard/new) and create a new Python function.

![napkin new function](/images/blog/20211028/napkin-dashboard-new.png)

We'll need a few modules: `requests`, `os`, and `napkin.store`. Napkin has hundreds of 
modules preinstalled in every Napkin runtime, including these three, so nothing 
more we need to do here other than import them.

```python
from napkin import store
import requests
import os
```

Napkin lets you create and modify Environment Variables for each of your functions. 
We can store our Discord webhook URL and Etherscan API Key there via 
Other > Environment Variables.

![napkin environment variables](/images/blog/20211028/napkin-ui-other.png)

Coding time. Let's split up the main tasks for our monitor into helper functions. 
We'll need to look up current Gas price, decide if it's a good price, and optionally 
send a message on Discord. We'll also need a way to cache and retrieve the last 
price we saw.

Napkin provides a [built-in key value store](https://napkin.wiki/docs/python#a58119047590473db569f9a0f1f077c8) 
 to persist data across function runs, so we can use that to save and look up the previous price.

We'll simply assume that the current Gas price is "good" if it's less than 140 [GWEI]( https://www.investopedia.com/terms/g/gwei-ethereum.asp), 
but feel free to use your own logic. 

```python
webhook_url = os.getenv('DISCORD_WEBHOOK_URL')
gas_url = "https://api.etherscan.io/api?" \
  + "module=gastracker" \
  + "&action=gasoracle" \
  + f"&apikey={os.getenv('ETHERSCAN_API_KEY')}"
THRESHOLD_GWEI = 140

def send_alert(message):
    requests.post(webhook_url, json={'content': message})

def get_gas_price():
    data = requests.get(gas_url).json()
    return int(data['result'].get('SafeGasPrice'))

def should_alert(current_price, past_price):
    return current_gas_price < THRESHOLD_GWEI < past_price

def save_last_price(price):
	store.put('last_gas_price', price)
```

With our helper functions written, the final logic is pretty short.

```python
current_gas_price = get_gas_price()
last_gas_price = store.get('last_gas_price')['data'] or THRESHOLD_GWEI+1

if should_alert(current_gas_price, last_gas_price):
    send_alert(f"Gas Price Alert: Current price is {current_gas_price} Gwei.")

save_last_price(current_gas_price)
```

Check out our example function [here](https://www.napkin.io/n/3df3e8045cd14e8a) 
to see the final code.

Lastly, we'll schedule our function to run automatically. Napkin
 [lets you schedule your functions](https://www.napkin.io/scheduling) 
 to run every minute, every hour, or once a day. In this case, we'll 
 do every minute so that we don't miss any good Gas deals. Simply 
 navigate to the "Schedule" tab and select "Every Minute".


![napkin schedule ui](/images/blog/20211028/napkin-ui-schedule.png)

Now, just hit the big, blue "Deploy", and we're done! From there we can can watch 
the function running every minute in the "Event Logs" tab.

![napkin event logs](/images/blog/20211028/napkin-event-logs.png)

Once the monitor spots good Gas fees, it will give us a shout on Discord.

![discord alert example](/images/blog/20211028/discord-alert.png)

Happy coding! 🚀🌚


Build a custom price monitor and get notified when Gas is cheap

Napkin Blog

Build a Discord Bot to Track the ISS with Napkin

ETH Gas Price Alerts on Discord with Napkin

Write and deploy cloud functions from your browser.