Discord Oauth2 Tutorial
AtticusKuhn (240)

Discord Oauth2 in repl.it


Setting up a basic repl.
Get Credentials
Set up the Front End
Setting up the Back End
All Together


In this tutorial, I will teach you how to implement Discord Oauth in node.js. This tutorial is intended for people who have not used Discord Oauth before.


I haven’t seen any good tutorials on implementing discord oauth in repl.it. When I searched, I found https://repl.it/talk/share/Discord-OAuth-API-Simplified/11141, but that was not really a tutorial.

Setting up a basic repl.

Make a node.js repl. In addition to the index.js file, we also need a index.html file and a .env file. For the http server, I will use express. At first it will just be a basic server which writes index.html. Here is an example

var express = require('express');
var app = express();
var bodyParser = require('body-parser');
app.get('/', function (req, res) {
 res.sendFile( __dirname + "/" + "index.html" );

Get Credentials

We need to go to https://discordapp.com/developers/applications. Click the blue button which says “New Application”. Once you have named it, click the button on the left which says “🔧 Oauth2”. We now need to add a redirect url. This is just the url of your site. In my case, it is https://discord-oauth-tutorial.atticuskuhn.repl.co. Once we’ve selected the url, we can specify our scopes. For this tutorial, I will only be using the identify scope, but later I might make another tutorial on the other scopes. We can now copy the url. Mine looks like https://discordapp.com/api/oauth2/authorize?client_id=705110680570691634&redirect_uri=https%3A%2F%2Fdiscord-oauth-tutorial.atticuskuhn.repl.co&response_type=code&scope=identify. You can go there now, but it won’t do anything until we are done. We also need to copy the Client Id and Client Secret into our .env file. In my case, the .env file now looks like

ClIENT_ID = 705110680593851634
CLIENT_SECRET = Em1Ua323dZm3CYMjHEvZ8Ae23cfjusNg

Set up the Front End

In Index.html, all we really need is a link which goes to the url we got before. I tried to stylize it into a button. You also could add a place to display the result. Once the person clicks “Authorize” on the discord Oauth, they will be redirected back to the home page, but with a token that might look like “?code=qFs6uc8IZd988yBtYhBaWMhiH6TvKZ”. We need to send this token to our server to get the information. To get the code from the URL, we might use something like

window.onload = () => {
            const code = location.href.substring(location.href.indexOf("code")+5, location.href.length)
            if (location.href.indexOf("code") > -1) {
               const req = new XMLHttpRequest()
               req.open("POST", "https://discord-oauth-tutorial.atticuskuhn.repl.co")
               req.onload = () => {
               if (req.status == 200) {
			// deal with this later

Setting up the Back End

Once we have the code, we can make requests to the Discord API. To make this request, I am going to use fetch and axios. We need to request https://discordapp.com/api/oauth2/token as a form (very important) with our credentials and the code from the user. An example might look like.

const data = new FormData();
   data.append('client_id', process.env.CLIENT_ID;
   data.append('client_secret', process.env.CLIENT_SECRET);
   data.append('grant_type', 'authorization_code');
   data.append('redirect_uri', "https://discord-oauth-tutorial.atticuskuhn.repl.co");
   data.append('scope', 'identify');
   data.append('code', req.body.code);
   fetch('https://discordapp.com/api/oauth2/token', {
       method: 'POST',
       body: data,
       .then(res => res.json())

This doesn’t quite get us the data we want, but it does give us an authorization token, which we can use to request discord for that data. To get the data, we need one final step, which is

const config = {
                   "authorization":`Bearer ${data.access_token}`

Now we can write the response back to the frontend to display it to the user.

All Together

Now you can end up with something like https://discord-oauth-tutorial.atticuskuhn.repl.co.

You are viewing a single comment. View All