OAuth

Enable users to either authorize your app to perform actions on their behalf (i.e. grant write permissions), or simply verify who they are and give you access to their Audius profile info (no write permissions granted).

Methods

init

init(params)

Enables the Audius OAuth functionality. Call this before using any other oauth methods.

• successCallback (profile: UserProfile, encodedJwt: string) => void - function to be called when the user successfully authorizes or authenticates with Audius. This function will be called with the user's profile information, which is an object with the following shape:

  // `UserProfile` type:
  {
    userId: number; // unique Audius user identifier
    email: string;
    name: string; // user's display name
    handle: string;
    verified: boolean; // whether the user has the Audius "verified" checkmark
   
    /** URLs for the user's profile picture, if any.
    * If the user has a profile picture, three sizes will be available: 150x150, 480x480, and 1000x1000.
    * If the user has no profile picture, this field will be empty.
    */
    profilePicture: {"150x150": string, "480x480": string, "1000x1000": string } | { misc: string } | undefined | null
    apiKey: string | null // the API key for your application if specified
    sub: number; // alias for userId
    iat: string; // timestamp for when auth was performed
  }

  The second argument (encodedJwt) is for advanced use cases that want to pass the JWT to a backend for server-side verification.

• errorCallback optional (errorMessage: string) => void - function to be called when an error occurs during the authentication flow. This function will be called with a string describing the error.

Returns: Nothing

audiusSdk.oauth.init({
  successCallback: (user) => console.log('Logged in user', user),
  errorCallback: (error) => console.log('Got error', error),
})

renderButton

renderButton(params)

Replaces the element passed in the first parameter with the Log In with Audius button.

• element HTMLElement - HTML element to replace with the Log In with Audius button

• scope optional 'write' | 'read' - Whether your app is requesting read or write permissions to the user's account. Specify "write" if you'd like the user to authorize your app to perform actions on their behalf, such as uploading a track or favoriting a playlist. Specify "read" if you simply need the user's email and profile information, and do not need any write permissions. Defaults to "read".

• buttonOptions optional ButtonOptions - optional object containing the customization settings for the button to be rendered. Here are the options available:

  // type ButtonOptions =
  {
    // Size of the button:
    size?: "small | 'medium' | 'large'
   
    // Corner style of the button:
    corners?: 'default' | 'pill'
   
    // Your own text for the button; default is "Log In with Audius":
    customText?: string
   
    // Whether to disable the button's "grow" animation on hover:
    disableHoverGrow?: boolean
   
    // Whether the button should take up the full width of its parent element:
    fullWidth?: boolean
  }

  Use this playground to see how these customizations affect the button appearance and determine what config works best for your app.

Returns: Nothing

audiusSdk.oauth.renderButton({
  element: document.getElementById('audiusLogInButton'),
  scope: 'write',
  buttonOptions: {
    size: 'large',
  },
})

login

login(params)

Opens the Log In with Audius popup, which begins the authentication flow. Use this if you have your own link or button implementation, and don't want to use renderButton.

• scope optional 'write' | 'read' - Whether your app is requesting read or write permissions to the user's account. Specify "write" if you'd like the user to authorize your app to perform actions on their behalf, such as uploading a track or favoriting a playlist. Specify "read" if you simply need the user's email and profile information, and do not need any write permissions. Defaults to "read".

Returns: Nothing

function logInWithAudius() {
  audiusSdk.oauth.login({ scope: 'write' })
}

<button onclick="logInWithAudius()">Continue with Audius!</button>

isWriteAccessGranted

isWriteAccessGranted(params)

Checks whether your app has write permissions to the given user's account.

• userId string - User's Audius user ID

Returns: Promise<boolean>

async function hasSkrillexAuthorizedApp() {
  await audiusSdk.oauth.isWriteAccessGranted({ userId: 'eAZl3' })
}