identityserver4 with redux -oidc client requested access token - but client is not configured to receive access tokens via browser

Question

My identityserver4 client looks like this:

new Client {
    ClientId = "openIdConnectClient",
    ClientName = "Example Implicit Client Application",
    //AllowedGrantTypes = GrantTypes.Implicit,
    AllowedGrantTypes = GrantTypes.ClientCredentials,
    ClientSecrets =
    {
       new Secret("secret".Sha256())
    },
    AllowOfflineAccess = true,
    AllowAccessTokensViaBrowser = true,
    AccessTokenLifetime = 30,
    AllowedScopes = new List<string>
    {
        IdentityServerConstants.StandardScopes.OpenId,
        IdentityServerConstants.StandardScopes.Profile,
        IdentityServerConstants.StandardScopes.Email,
        "role",
        "customAPI.write"
    },
    RedirectUris = new List<string> {"http://localhost:8080/callback"},
    PostLogoutRedirectUris = new List<string> {"https://localhost:44330"},
    AllowedCorsOrigins = new List<string>
     {
         "http://127.0.0.1:8080",
         "http://localhost:8080",
         "*"
     },
}

In react application, my userManager class looks like this:

 import { createUserManager } from 'redux-oidc';

const userManagerConfig = {
  client_id: 'openIdConnectClient',
  redirect_uri: `${window.location.protocol}//${window.location.hostname}${window.location.port ? `:${window.location.port}` : ''}/callback`,
  //response_type: 'code id_token token',
  response_type: 'token id_token',
  scope: 'openid profile email role',
  authority: 'http://localhost:50604',
  silent_redirect_uri: `${window.location.protocol}//${window.location.hostname}${window.location.port ? `:${window.location.port}` : ''}/silent_renew.html`,
  automaticSilentRenew: true,
  filterProtocolClaims: true,
  loadUserInfo: true,
};

const userManager = createUserManager(userManagerConfig);

export default userManager;

The question is: when i try to call my identityserver4 from the redux-oidc example application. I'm getting the following error:

Client requested access token - but client is not configured to receive access tokens via browser

I hope you understood the question. Please someone help me with this. i have provided the link for this example application bellow.

Redux-oidc example app link

Answer 1

Your code contains two different grant types. The different Grant types in Identity server 4 have different requirements. Here is a bit of information to help you understand the different types you are using. It may also help you understand why you were having this problem.

GrantTypes.ClientCredentials

The Client credentials is the simplest grant type and is used for server to server communication - tokens are always requested on behalf of a client, not a user.

With this grant type you send a token request to the token endpoint, and get an access token back that represents the client. The client typically has to authenticate with the token endpoint using its client ID and secret.

new Client
    {
        ClientId = "client",

        // no interactive user, use the clientid/secret for authentication
        AllowedGrantTypes = GrantTypes.ClientCredentials,

        // secret for authentication
        ClientSecrets =
        {
            new Secret("secret".Sha256())
        },

        // scopes that client has access to
        AllowedScopes = { "api1" }
    }

GrantTypes.Implicit

The implicit grant type is optimized for browser-based applications. Either for user authentication-only (both server-side and JavaScript applications), or authentication and access token requests (JavaScript applications).

In the implicit flow, all tokens are transmitted via the browser, and advanced features like refresh tokens are thus not allowed. If you want to transmit access tokens via the browser channel, you also need to allow that explicitly on the client configuration:

Client.AllowAccessTokensViaBrowser = true;


 new Client
    {
        ClientId = "mvc",
        ClientName = "MVC Client",
        AllowedGrantTypes = GrantTypes.Implicit,

        // where to redirect to after login
        RedirectUris = { "http://localhost:5002/signin-oidc" },

        // where to redirect to after logout
        PostLogoutRedirectUris = { "http://localhost:5002/signout-callback-oidc" },

        AllowedScopes = new List<string>
        {
            IdentityServerConstants.StandardScopes.OpenId,
            IdentityServerConstants.StandardScopes.Profile
        },
        AllowAccessTokensViaBrowser = true
    }