Docs

OAuth with Hugging Face

You will learn the following:

  • Use Hugging Face to authenticate users with OAuth.

Before you start

Enabling OAuth with Hugging Face allows your users to sign in and sign up to your Clerk application with their Hugging Face account.

Configure for your development instance

To make the development flow as smooth as possible, Clerk uses preconfigured shared OAuth credentials and redirect URIs for development instances — no other configuration is needed. Navigate to the Clerk Dashboard and go to User & Authentication -> Social Connections. In the list of Auth Providers, enable Hugging Face and select Save.

Configure for your production instance

In production instances, you must provide custom credentials, which includes generating your own Client ID and Client Secret using your Hugging Face account. This tutorial will walk you through that process in just a few steps.

Create a Hugging Face Connected App

  1. Navigate to Hugging Face and sign in to your account.
  2. in the top right corner, select your avatar and select Settings.
  3. In the sidebar, select Connected Apps.
  4. Under Developer Applications, select Create App.
  5. Fill out the form as follows:
    • Application Name: Name the application whatever you'd like.
    • Homepage URL: Enter the homepage URL of your application.
    • Logo URL: Enter the URL of the logo for your application.
    • Token Expiration: Set the duration for which the token will be valid.
    • Scopes: Select the scopes that your application requires. Ensure that openid, profile, and email are included.
    • Redirect URLs: You will need to add the Authorized redirect URI from Clerk. See the next step.

Get your Redirect URI from Clerk

  1. In another tab, visit the Clerk Dashboard.
  2. In the navigation sidebar, go to User & Authentication > Social Connections.
  3. In the list of Auth Providers, enable Hugging Face.
  4. Ensure that both Enable for sign-up and sign-in and Use custom credentials are toggled on. Then, copy the Authorized redirect URI.
  5. Navigate back to Hugging Face and paste the Authorized redirect URI into the Redirect URLs field.
  6. Select Create application.

Set the Client ID and Client Secret in Clerk

  1. Once you have created your Hugging Face Connected App, copy the Client ID and App Secret.
  2. Navigate back to the Clerk Dashboard.
  3. In the Client ID and Client Secret field, paste the values you copied from Hugging Face.
  4. Select Save.

Test your OAuth

The simplest way to test your OAuth is to visit your Clerk application's Account Portal, which is available for all Clerk applications out-of-the-box.

  1. In the navigation sidebar of the Clerk Dashboard, select Account Portal.
  2. Next to the Sign-in URL, select Visit. The URL should resemble:
  3. On the sign-in page, you should see Continue with Hugging Face as an option. Use it to sign in with your Hugging Face account.

Feedback

What did you think of this content?
Edit this page on GitHub

Last updated on