skip to Main Content

Been looking for a way to connect Discord Auth with Open ID
I have done all the steps according to the Firebase Open ID documentated found:
https://firebase.google.com/docs/auth/web/openid-connect?hl=en&authuser=0

I have found a similar Auth provider using OpenID to connect to Discord and they have a custom Issuer config as Discord does not provide a .well-known/openid-configuration per firebase documentation

Source: https://fusionauth.io/docs/lifecycle/authenticate-users/identity-providers/gaming/discord

The setup with Firebase OpenID is:

Code Flow

Discord

Client ID from Discord App

Issuer (URL): https://cdn.myproject.cloudflare.com/discord/ *see below

Client ID from Discord App

In Discord Dev portal under OAuth2
The redirects has

https://myproject.firebaseapp.com/__/auth/handler

*Issuer URL

https://cdn.myproject.cloudflare.com/discord/

points to public json data file named "openid-configuration" in a directory called ".well-known"

contents of issuer URL/.well-known/openid-configuration:

{
    "issuer": "https://discord.com",
    "authorization_endpoint": "https://discord.com/api/oauth2/authorize",
    "token_endpoint": "https://discord.com/api/oauth2/token",
    "userinfo_endpoint": "https://discord.com/api/users/@me",
    "scopes_supported": [
        "openid",
        "email",
        "profile"
    ]
}

this is enabled from my app with my other auth providers.
Do I need to use a URL Generator for the Issuer URL or something else?

The simple fact is that Firebase does not allow custom Issuer URL overrides.

ERROR: Error signing in with Discord: FirebaseError: Firebase: Error (auth/operation-not-allowed).
at createErrorInternal (assert.ts:161:7)

2

Answers


  1. how I achieved this was (flow)

    1-> On redirect url get auth token
    const fragment = new URLSearchParams(window.location.hash.slice(1));
    const [accessToken, tokenType] = [fragment.get(‘access_token’), fragment.get(‘token_type’)];

            if (!accessToken) {
                window.location.href('/')
            }
            fetch('https://discord.com/api/users/@me', {
                headers: {
                    authorization: `${tokenType} ${accessToken}`,
                },
            })
    

    2-> after getting access token use firebase auth with custom token to signIn/Signup

    Login or Signup to reply.
  2. Use in on load event
    const fragment = new URLSearchParams(window.location.hash.slice(1));
    const [accessToken, tokenType] = [fragment.get(‘access_token’), fragment.get(‘token_type’)];
    then my previous code
    and i am providing here a direction . solution is specific to every project.
    follow documentation for step by step debug please

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search