Logging in and Logging out of the Auth0 Application

Learn how to log in and log out of the application by using the Auth0 API.

We'll cover the following

In this lesson, we’ll explore Auth0’s login and logout process. The login endpoint in Auth0 is where users enter their credentials to start the authentication process. If the credentials are valid, the server sends back an access token, which can be used to access the protected resources of the application. Conversely, the logout endpoint is used when a user's session is ended by revoking their access token. Both endpoints are part of an application's authentication flow and can be customized using Auth0's APIs and libraries.

Logging in to the Auth0 application

In this section, we’ll explore the login process of the Auth0 application. We’ll use the https//:{Domain}/authorize endpoint, which will redirect us to the login page of the application, where we can log in with the user credentials we created in the Signing up lesson.

Request parameter

Let's look at how we can use this endpoint to log in as a specific user. Some of the important parameters are as follows:

Parameter Name

Type

Category

Description

client_id

String

Required

Defines the client ID of the application.

response_type

String

Required

Defines the response type of the API call. The values that we can pass for this parameter are code, and token.

redirect_uri

String

Required

Defines the redirect URL of the login page.

connection

String

Optional

Defines the connection name.

scope

String

Optional

Defines the scopes.

state

String

Optional

A value included in the initial request that the authorization server includes when redirecting back to the application, which makes the application secure against the cross-site request forgery (CSRF) attacks.


This endpoint requires us to redirect to another page. So, we need an express server for that process set up at the end of the lesson, but we can explore the key part of this endpoint in the code snippet below.

Press + to interact
const app = express();
const port = 8080;
const clientId = '{{CLIENT_ID}}';
const domain = '{{DOMAIN}}';
const appUrl = '{{EDUCATIVE_LIVE_VM_URL}}'
const redirect_uri = `${appUrl}/callback`; //redirect uri
const loginURL = new URL(`https://${domain}/authorize?`);
const queryParams = new URLSearchParams({
    client_id: clientId,
    response_type: 'code',
    redirect_uri: redirect_uri,});
    loginURL.search = queryParams;

Let's look at the highlighted lines from the code shown above:

  • Line 1: We create an instance of the Express framework.

  • Line 2: We set the default port of the application to 8080.

  • Line 4: We define clientId variable and set it to the application's client ID.

  • Line 5: We define the domain variable and set it to the user's domain.

  • Line 6: We define the appUrl variable and set it to the user's URL.

  • Line 7: We define the redirect_uri variable and set it to the application's redirect URL.

  • Lines 9–12: We define the queryParams object in which we define different parameters like client_id, response_type, and redirect_uri.

Logging out of the Auth0 application

After exploring the login endpoint, let’s understand the logout process. The logout endpoint of Auth0 enables us to log out a user from an application that is integrated with Auth0. When a user logs out, their current session is terminated and they are redirected to the logout URL specified in the application settings. To invoke this endpoint, we will use the https//:{Domain}/v2/logout endpoint.

Request parameter

Let's move on to how we can use this endpoint to log out a specific user. Some of the important parameters are as follows:

Parameter Name

Type

Category

Description

returnTo

String

Optional

Defines the redirection URL after logging out of the application.

client_id

String

Optional

Defines the client ID of the application.

federated

String

Optional

Defines the query string to the logout URL, which helps the user to log out.

Let’s understand the key part of the logout endpoint in the code snippet below.

Press + to interact
const logoutURL = new URL(`https://${domain}/v2/logout?`);
const queryParams1 = new URLSearchParams({
  client_id: clientId,
  returnTo: appUrl,
});

Let's look at the highlighted lines from the code shown above:

  • Line 1: We define a logoutURL variable in which we define the logout endpoint URL.

  • Lines 2–5: We define the queryParams1 object in which we define parameters like client_id and returnTo.

Try on

Let's try it by clicking the “Run” button in the widget below.

Note: We can log in to our app by using the credentials we created in the previous lesson as well as the user we created in the “Users and Roles” chapter. Note that the user we created in the “Users and Roles” chapter must have been assigned a role.

import express from 'express';

const app = express();
const port = 8080;

const clientId = '{{CLIENT_ID}}';
const domain = '{{DOMAIN}}';
const appUrl = '{{EDUCATIVE_LIVE_VM_URL}}'
const redirect_uri = `${appUrl}/callback`; // redirect uri
const loginURL = new URL(`https://${domain}/authorize?`);
const queryParams = new URLSearchParams({
    client_id: clientId,
    response_type: 'code',
    redirect_uri: redirect_uri,});
    loginURL.search = queryParams;
app.get('/', function (req, res) {
  res.redirect(loginURL);
});

const logoutURL = new URL(`https://${domain}/v2/logout?`);
const queryParams1 = new URLSearchParams({
  client_id: clientId,
  returnTo: appUrl,
});
logoutURL.search = queryParams1;

app.get('/callback', (req, res) => {
  res.write(`<h1 style="text-align:center">Auth Code: ${req.query.code}</h1>`)
  res.write(`<p style="text-align:center"><a href=${logoutURL}><button>Log Out</button></a></p>`)
  res.send(`Hello World${req.query.code}`);
});

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`);
});
Login and logout endpoints