Connecting to Spotify API
Allow users to access their Spotify account information in your app.
In this tutorial, we'll show you how you can connect the Spotify API to Bravo using OAuth 2.0. This allows creating apps that will be able to fetch user data stored in Spotify, such as user playlists, favorite songs, and so on.
Once you have logged in to the dashboard, create a new app with a name of your choice. After creating the app, click on
In the pop-up, find a field for
Redirect URIs. There, add the following callback URLs:
https://a<your_app_id>.callbacks.bravostudio.app. Replace <your_app_id> with the Bravo app ID value (without the "<" and ">" characters).
- This can be found in the URL of your Bravo app project: https://projects.bravostudio.app/apps/XXXXXXX/screens
After, copy the Client ID and Client Secret, as you'll need to add them later into Bravo Studio.
After you have created the app project, go to
OAuth 2.0in the Bravo project dashboard. There, select Spotify as the OAuth 2.0 provider, and paste the Client ID and Client Secret values you copied from the Spotify Developer dashboard in the previous step.
Once you have set all those parameters, click
In order to create requests targeting the Spotify API, check what are the available API endpoints, and which operations they allow in the Spotify API guides. For instance, a GET request against the
https://api.spotify.com/v1/me/playlistsURL will return a list with all the playlists the Spotify user has created.
In the sample design setup below, we created a screen to display the user's top artists. In this case, we would use the request URL
In the request setup page, go to Collection Settings. Go to
Authentication> for Type, select
Use settings from application (OAuth2)> For Testing app, select the name of the app where you added the Spotify settings for OAuth 2.0. Click
Continue to set up an API request. Click
Send, and you'll be asked to log in, as this request is using OAuth 2.0. You'll need to log in using the same Spotify credentials you used to create the app in the Spotify for Developers dashboard.
Once you authenticate, you should see a success screen. Close this browser tab, return to the API Collections dashboard to set up the API request as usual, and bind API data to the UI elements.