oauth providers/spotify

8 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Spotify OAuth setup overview

Setting up Spotify logins for a Supabase application consists of three parts: creating and configuring a Spotify Project and App on the Spotify Developer Dashboard, adding the Spotify API Key and API Secret Key to the Supabase Project, and adding the login code to the Supabase JS Client App.

Create Spotify OAuth app steps

To create a Spotify OAuth app: log into Spotify, go to the Spotify Developer Dashboard, click Create an App, type an app name and description, check the box to agree with Developer TOS and Branding Guidelines, click Create, save the Client ID and Client Secret, click Edit Settings, paste the Supabase Callback URL in the Redirect URIs box, click Add, and click Save.

Configure Spotify auth via Management API

Spotify auth provider can be configured using the Management API by sending a PATCH request to https://api.supabase.com/v1/projects/{PROJECT_REF}/config/auth with Authorization header containing the access token and JSON body containing: external_spotify_enabled (boolean), external_spotify_client_id (string), and external_spotify_secret (string).

JavaScript Spotify sign-in example

To sign in with Spotify in JavaScript, call supabase.auth.signInWithOAuth() with provider set to 'spotify': ```js import { createClient } from '@supabase/supabase-js' const supabase = createClient('https://your-project-id.supabase.co', 'sb_publishable_...') async function signInWithSpotify() { const { data, error } = await supabase.auth.signInWithOAuth({ provider: 'spotify', }) } ```

Flutter Spotify sign-in example

To sign in with Spotify in Flutter, call supabase.auth.signInWithOAuth() with OAuthProvider.spotify. Optionally set redirectTo for deeplink on mobile and authScreenLaunchMode to control how the auth screen launches: ```dart Future<void> signInWithSpotify() async { await supabase.auth.signInWithOAuth( OAuthProvider.spotify, redirectTo: kIsWeb ? null : 'my.scheme://my-host', authScreenLaunchMode: kIsWeb ? LaunchMode.platformDefault : LaunchMode.externalApplication, ); } ```

Kotlin Spotify sign-in example

To sign in with Spotify in Kotlin, call supabase.auth.signInWith() with Spotify as the Provider: ```kotlin suspend fun signInWithSpotify() { supabase.auth.signInWith(Spotify) } ```

C# Spotify sign-in example

To sign in with Spotify in C#, call supabase.Auth.SignIn() with Provider.Spotify as the provider: ```c# var state = await supabase.Auth.SignIn(Provider.Spotify); var signInUrl = state.Uri; ```

Spotify OAuth flow process

The Spotify OAuth flow proceeds as follows: the sign-in method is called from the client library, the user is redirected to the Spotify login page, after completing sign-in the user is redirected to the app with an error that the email address needs to be confirmed and receives a confirmation email from Supabase Auth, the user clicks the confirmation link in the email, and the user is brought back to the app and is now signed in.

Give your agent this brain