Difficulty Level : Intermediate
Call the Spotify Accounts Service. See that the app.js file contains three calls to the Spotify Accounts Service: The first call is the service ‘/authorize’ endpoint, passing to it the client ID, scopes, and redirect URI. App Authorization: Spotify authorizes your app to access the Spotify Platform (APIs. Redirecturi: Required. The URI to redirect to after the user grants or denies permission. This URI needs to have been entered in the Redirect URI. FutureHype, a user on Spotify We and our partners use cookies to personalize your experience, to show you ads based on your interests, and for measurement and analytics purposes. By using our website and our services, you agree to our use of cookies as described in our Cookie Policy. Download this app from Microsoft Store for Windows 10. See screenshots, read the latest customer reviews, and compare ratings for Spotify Music.
License Requirement : Community Plan or Power Apps / Power Automate per app or per user plan
Technical Article Details: Error: 400: Invalid redirecturi. Spotify app will request user authorization UI if necessary. Methods inherited from class java.lang.Object equals, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait. Send redirect uri for authentication purposes. Required for release builds. Parameters: redirectUri - uri registered in the developer.spotify.
If you are not interested in the inception of this, skip the very interesting story and just jump to Let’s Create.
This whole idea started when I was on a road-trip from Cincinnati to Orlando with my #FlowFam ( Jon Levesque, Anton Robbinsand Ed Gonzalez). We had more than 12 hours to spend and to make the most out of it we could only do one thing – Make a flow!
The flow had to be something around the road trip and we wanted to involve the community so that they felt like they were a part of it. So, we thought what if we could create a flow which when triggered manually, takes the geo location and the song that we are currently playing on Spotify and posts it on Twitter. And 1 hour later –
To take it to the next level, we created a flow to accept song requests from twitter , which we received as approvals (as some people were rick rolling us) and then as we hit on approve, it played the song right then. To see all this in action, watch this video from Jon who vlogged the whole story –
When I built the flow (in the backseat of the pickup) I couldn’t make the best optimized version of it. I actually wanted to use a custom connector, however, for some reason that wasn’t working correctly and that’s why we had to use HTTP actions in flow and I had to generate a refresh token every hour and change it in the flow.
Let’s create
In this blog post, we will create a custom connector to connect to the Spotify API and use it to search for tracks, play a sound track and get the current playing track.
- Step 1 – Register an app on Spotify
- Step 2 – Create a custom connector
- Step 3 – Use in Power Automate and Power App
If you are thinking about not doing this because custom connectors are premium, WAIT! You can create a community plan for your personal use for free!
Step 1 – Register an app on Spotify
If you don’t have Spotify premium, you can still use the custom connector , however, you won’t be able to play specific tracks. So, I would highly recommend getting the free trial.
Follow the steps below to create an app on the Spotify developer portal –
Once you have created the app, you can copy the client id and client secret and paste it in notepad or whatever you think is a secure place (probably a sticky note pasted on your monitor)
Step 2 – Create a custom connector
If you don’t know anything about custom connectors or APIs , don’t worry! I didn’t know anything about it a year ago (and yes I still call myself That API Guy)
First, go to either make.powerapps.com or flow.microsoft.com and log in with your credentials. Click on custom connectors in the left navigation menu.
Next, click on New custom connector -> Create from blank. Then enter a name for the connector and click on continue.
Now, you will see a wizard kind of experience with 4 steps, each of which I have described below with the screenshots.
In the security tab, use these values-
- For Authorization URL : https://accounts.spotify.com/authorize
- For Token and Refresh URL : https://accounts.spotify.com/api/token
- Redirect URL – This will be generated after you click on create connector.
- For Scope : user-read-currently-playing user-modify-playback-state playlist-modify-private playlist-read-collaborative playlist-read-private user-read-playback-state
Scope defines what permissions you want to give to you to your Spotify app. For this blog post, the scope above will be sufficient for all the actions that we want to perform. You can add / modify this later based on your requirement.
If you select Spotify under the identity provider, it messes up the scope and doesn’t prompt you to allow for all permissions that you entered in the scope. So, don’t select it please.
Click on create connector. You will now see that the redirect URL has been created. Copy it and paste it on your Spotify app’s settings and save it.
For the Definition step, let’s create an action to get the current song playing on Spotify. We will try some other API endpoints at a later stage.
Next, click on “Import from Sample” under the Request section to define the endpoint we
Click on “Update Connector” and then go to the last tab ‘Test”.
You will have to create a new connection to test your custom connector.
A window will pop-up asking you to log in to Spotify (if you aren’t already logged in to it in that same browser window). Once you log in, you will be asked to allow the Spotify app all the permissions that we entered in the scope. Click on agree the same way you would do for all the random apps in the world, at-least this an app that you created. You can TRUST this one! 🙂
Once you click agree, the connection will be created and weirdly you will be redirected to the Connections page. You would think that it would stay on the same page and allow you to test, however, not everything comes that easy I guess. Anyways, now that you are on the connections page, just search for Spotify and check if connection was created.
Now, go back to Custom connectors page and click on edit, and go to the ‘Test’ section. You will now see the connection that you just created in the Connections drop-down list. All that is left to do is to click on ‘Test Operation”! Before you do that, play a song on your Spotify.
Here’s a demo –
👍 Wow! that must feel good to get that working. That’s just the start though.
Here are some more actions (API endpoints) to have fun with this connector. You can create a lot more from using this API reference doc.
Step 3 – Use in Power Automate and Power App
Now that you have the custom connector created, let’s use it in a flow and app.
- In a flow – We will create a flow to search for a christmas song and play the first one from the list of results.
This is the expression I used to get the track id from the JSON response from the Search for tracks action –
Let’s see it in action now –
Spotify Artist Uri
2. In a Power App – Let’s make this one a challenge. Create a Power App with this custom connector and tweet a demo of it on Twitter with the hashtag #PowerPlaySpotify and I will do something special for you!
Here’s some inspiration –
There is a lot more that you can do with this connector, especially for the holiday season. So go create this and tweet about it with the #PowerPlaySpotify . I would love to see your creativity with it.
Note: If you do end up using other actions / endpoints, make sure to check if the scope required for that endpoint is included in the Scope under security.
Spotify Ios Redirect Url
Enjoy and Happy holidays!