# Add FusionAuth Login to an App You Build

Learn how to add FusionAuth login to a web, mobile, or single-page app you build with an OpenID Connect library and the OAuth Authorization Code grant.

> For the index of this section of the site, see [llms.txt](https://fusionauth.io/docs/llms.txt)

Your app sends users to the FusionAuth [hosted login pages](https://fusionauth.io/docs/concepts/integration-points.md#hosted-login-pages) with the [Authorization Code Grant](https://fusionauth.io/docs/authentication/oauth.md). After login, FusionAuth redirects the browser back to your app with a code, and your app exchanges the code for tokens. An OpenID Connect library builds the requests and validates the tokens, so you configure the library and FusionAuth. To add login to software you don't build, such as a SaaS product, see [Add Login to an External App](https://fusionauth.io/docs/authentication/act-as-an-idp/add-login-to-external-app.md).

For a working sample app in your framework, start from a [QuickStart](https://fusionauth.io/docs/quickstarts.md) instead.

## Before You Begin

You need:

*   Admin access to FusionAuth.
*   An OpenID Connect library for your framework, or a [FusionAuth SDK](https://fusionauth.io/docs/sdks.md).
*   The URL in your app that receives the user after login, such as `https://app.example.com/callback`.
*   A test user in the [Tenant](https://fusionauth.io/docs/concepts/types/tenants.md) you plan to use.

## Set the Issuer

FusionAuth puts the Tenant **Issuer** in the **`iss`** claim of every token and in the discovery document. The setup wizard sets the issuer to the URL you used during setup, which might be `localhost`. Installs that skip the setup wizard, such as Kickstart installs, keep a placeholder such as `https://example.com`. New Tenants copy the issuer of the Default Tenant. A library that takes an issuer instead of a discovery URL loads the endpoints from the issuer, so the placeholder breaks login. To set the issuer to the URL your app uses to reach FusionAuth:

1.  Navigate to Tenants and click edit next to your Tenant.
2.  On the General tab, set **Issuer** to the FusionAuth URL, such as `https://auth.example.com`.
3.  Click save.

## Create an Application

Each app needs its own [Application](https://fusionauth.io/docs/concepts/types/applications.md) in FusionAuth. To create and configure the Application:

1.  Navigate to Applications and click add.
2.  Enter a **Name** and select the **Tenant** that holds your users.
3.  Select the OAuth tab.
4.  Add the callback URL of your app to **Authorized redirect URLs**.
5.  Set **Logout URL** to the page your app shows after logout.
6.  Set **PKCE** to `Required`.
7.  Set **Client Authentication** for your type of app:
    *   For an app with a server that can keep a secret, keep the default, `Required`.
    *   For a single-page or mobile app, select `Not required when using PKCE`. A browser or a device can't keep the client secret private.
8.  Click save.

New Applications enable the `Authorization Code` and `Refresh Token` grants and **Generate refresh tokens**, so your app can keep users logged in after the access token expires.

## Register Users

Any user in the Tenant can log in by default. FusionAuth adds the **`roles`** claim to the tokens only when the user has a [Registration](https://fusionauth.io/docs/concepts/types/registrations.md) for the Application.

To register the test user, navigate to Users , click user next to the user, and click **Add registration**. To let users register themselves, turn on [self-service registration](https://fusionauth.io/docs/users/register/basic-registration-forms.md). To block users without a registration, enable **Require registration to complete OAuth authorization** on the OAuth tab.

## Configure Your Library

On the Applications page, open the action menu for the Application and select View . The dialog shows the values your library needs. See [OAuth2 & OpenID Connect Integration Details](https://fusionauth.io/docs/concepts/types/applications.md#oauth2--openid-connect-integration-details).

Give your library these values:

| Library setting | Value |
| --- | --- |
| Discovery URL | The **OpenID Connect Discovery** URL from the View dialog. When your library asks for an issuer instead, use the Tenant **Issuer**. |
| Client Id | The **Client Id** from the View dialog. |
| Client secret | The **Client secret** from the View dialog. Leave the secret out of single-page and mobile apps. |
| Redirect URI | The callback URL you added to **Authorized redirect URLs**. |
| Scopes | `openid offline_access`. Add `email` and `profile` to get those claims in the Id token. |
| PKCE | `S256`. |

Your library then sends users to the login page and exchanges the code for tokens. The library also validates the [Id Token](https://fusionauth.io/docs/authentication/oauth/tokens.md#id-token): the signature, the **`iss`** and **`aud`** claims, and the expiration. For the claims in each token, see [Tokens](https://fusionauth.io/docs/authentication/oauth/tokens.md). For the requests your library makes, see the [Authorization Code grant example](https://fusionauth.io/docs/authentication/oauth.md#example-authorization-code-grant).

Store tokens on your server, or in `HttpOnly` cookies for a browser app. For a single-page app without a backend, the [hosted backend](https://fusionauth.io/docs/apis/hosted-backend.md) exchanges the code and sets the cookies for your app.

## Log Users Out

To log a user out, your app ends the app session and redirects the browser to the **Logout URL** from the View dialog:

```plaintext
https://auth.example.com/oauth2/logout?client_id={clientId}
```

FusionAuth ends the FusionAuth session and redirects the browser to the Application's **Logout URL**. To send the browser to another page, add a `post_logout_redirect_uri` parameter, and add that page to **Authorized redirect URLs**. FusionAuth shows an error page for a `post_logout_redirect_uri` that isn't in the list.

## Confirm the Login

To confirm that login works:

1.  Open your app in a private browser window and start login.
2.  Confirm that the browser shows the FusionAuth login page.
3.  Log in as the test user.
4.  Confirm that the browser returns to the callback URL and that your app shows the test user as logged in.
5.  Log out, and confirm that the browser returns to your app.
6.  Start login again, and confirm that FusionAuth asks for credentials.

When the login fails, enable **Enable debug logging** on the OAuth tab of the Application and try again. Read the details in System -> Event Log . Turn off debug logging when you finish.

Related

[APIs OpenID Connect API Learn about the APIs for creating, retrieving, updating and deleting OpenID Connect identity providers. openid connectoidcoauth](https://fusionauth.io/docs/apis/identity-providers/openid-connect.md)

[APIs Authorize API API documentation for the FusionAuth Authorize OAuth2 endpoint. oauthauthorization code grantpkce](https://fusionauth.io/docs/apis/oauth/authorize.md)

[Authentication Authentication Learn how users and clients log in with FusionAuth, and how FusionAuth acts as an identity provider for other applications. loginoauthoidc](https://fusionauth.io/docs/authentication.md)

[Authentication OIDC Prompt Learn about OpenID Connect prompt and example use cases. oidcopenid connectlogin](https://fusionauth.io/docs/authentication/oauth/prompt.md)
---

## Other pages in OAuth

> For the full index of this section, see [Authentication](https://fusionauth.io/docs/llms-authentication.txt).

- [CIMD Registration Caching And Lifecycle](https://fusionauth.io/docs/authentication/oauth/cimd-registration-lifecycle.md): Learn how long FusionAuth caches a Client ID Metadata Document, what happens when it expires, and how a CIMD client registration is refreshed or removed.
- [OAuth Client Registration | Static and CIMD](https://fusionauth.io/docs/authentication/oauth/client-registration.md): Learn how FusionAuth registers OAuth clients, either ahead of time as Applications or just-in-time from a Client ID Metadata Document.
- [Use DPoP In A Browser App](https://fusionauth.io/docs/authentication/oauth/dpop/browser-app.md): Learn how to bind tokens to the browser with DPoP using the FusionAuth React, Angular, or Vue SDK.
- [Demonstrating Proof-of-Possession (DPoP)](https://fusionauth.io/docs/authentication/oauth/dpop.md): Learn how DPoP binds FusionAuth access and refresh tokens to a key pair that only your client holds.
- [Validate DPoP Requests In Your API](https://fusionauth.io/docs/authentication/oauth/dpop/validate-requests.md): Learn how to check DPoP proofs and DPoP-bound FusionAuth access tokens in your API.
- [Host A Client ID Metadata Document (CIMD)](https://fusionauth.io/docs/authentication/oauth/host-cimd-document.md): Publish a Client ID Metadata Document so your OAuth client can log in to FusionAuth without being registered ahead of time.
- [OAuth](https://fusionauth.io/docs/authentication/oauth.md): Learn about the OAuth 2.0 and OpenID Connect grants FusionAuth supports for login and single sign-on.
- [OAuth Issuer Validation](https://fusionauth.io/docs/authentication/oauth/issuer-validation.md): Learn how to validate the authorization response issuer parameter (RFC 9207) to prevent mix-up attacks.
- [Connect claude.ai And chatgpt.com To A FusionAuth-Protected MCP Server](https://fusionauth.io/docs/authentication/oauth/mcp-clients-claude-chatgpt.md): Learn how to connect claude.ai and chatgpt.com to an MCP server protected by FusionAuth using Client ID Metadata Documents.
- [Modes](https://fusionauth.io/docs/authentication/oauth/modes.md): Learn about the eight common ways apps use OAuth and OpenID Connect.
- [OIDC Prompt](https://fusionauth.io/docs/authentication/oauth/prompt.md): Learn about OpenID Connect prompt and example use cases.
- [OAuth Response Modes](https://fusionauth.io/docs/authentication/oauth/response-modes.md): Learn about OAuth 2.0 response modes (query, fragment, form_post) and when to use each one.
- [Manage Software Tokens](https://fusionauth.io/docs/authentication/oauth/tokens.md): Learn about OAuth2 and OpenID Connect Tokens and how they are used.
- [URL Validation](https://fusionauth.io/docs/authentication/oauth/url-validation.md): Learn about OAuth URL validation policies in FusionAuth.