How to set grant_type to client_credentials in @auth0/@auth0-react SDK?

For some reason, I want to set grant_type to client_credentials when call /oauth/token endpoint.
I’m not sure if this requirement can be achieved in a single page application. At least I didn’t find a way to set grant_type in auth0 react SDK.

I have seen this section doc: Get Management API Access Tokens for Production

I also wonder if we can directly set the value of is_first_party directly in the Auth0 Management Dashboard(https://manage.auth0.com/dashboard).

And here is my config (code source: auth0 react SDK example code)

const deferred = (() => {
  const props = {};
  props.promise = new Promise((resolve) => (props.resolve = resolve));
  return props;
})();

export const getAccessToken = async () => {
  const getToken = await deferred.promise;
  return getToken();
};

// Please see https://auth0.github.io/auth0-react/interfaces/Auth0ProviderOptions.html
// for a full list of the available properties on the provider
const config = getConfig();

const providerConfig = {
  domain: config.domain,
  clientId: config.clientId,
  audience: config.audience,
  redirectUri: window.location.origin,
  useRefreshTokens: true,
  onRedirectCallback,
};

ReactDOM.render(
  <Auth0Provider {...providerConfig}>
    <Auth0Context.Consumer>
      {({ getAccessTokenSilently }) => {
        deferred.resolve(getAccessTokenSilently);
        return <App />;
      }}
    </Auth0Context.Consumer>
  </Auth0Provider>,
  document.getElementById('root')
);

Hi @leslie :wave:

For some reason, I want to set grant_type to client_credentials when call /oauth/token endpoint.
I’m not sure if this requirement can be achieved in a single page application. At least I didn’t find a way to set grant_type in auth0 react SDK.

The client_credentials grant is typically executed from a backend context, where something like a service - or some other machine-level executable - is requesting a token for a machine-level (i.e. non-user) API call. For client_credentials grant a client_secret is required, and forms part of the machine-level credentials. As such, the backend context should be secure, so use of client_credentials is not recommended from an (insecure) client context; typically, Auth0 will guard against use in a client-side (e.g. React) context by only permitting the grant on a Machine to Machine type application.

I have seen this section doc: Get Management API Access Tokens for Production

For the Auth0 Management API, you will indeed require an Access Token allocated using the client_credentials grant, so typically won’t be able to - and shouldn’t - do this in a client-side (e.g. React) context.

I also wonder if we can directly set the value of is_first_party directly in the Auth0 Management Dashboard(https://manage.auth0.com/dashboard).

By default, all Applications defined via the Auth0 Dashboard are First Party (see here for more details). If you are trying to bypass the consent page for your API, then in the settings on the API definition you’ll see an option toggle to Allow Skipping User Consent - which you can enable for First Party applications (see here for more details).

Note: This toggle allows skipping consent for verifiable first party applications. If your application is hosted on localhost, Auth0 has no reason to believe that it’s truly first party - as a user may maliciously - or without their knowledge - run any application on localhost. If you want to skip the consent page during development, you can typically setup a mapping in your hosts file to map localhost to app.local for example.

2 Likes