13/08/20: API Travails
12:32 PM
Hey there! For a few months now I’ve been learning JavaScript and along the line I got an Udemy course to have an ordered learning path or structure. The method I’ve used to learn with the course is that I watch a section, then some projects the instructor builds. Afterward, I build something related to the project using what I learned. I finished the API section a while ago and built a minor project here. I wanted to do another project before moving on to the next section, and I decided on using the Spotify API for it. Yes, I know, another music-related API lol, but I was curious to see what I can do with it, especially after seeing this (Made by Nigerians, it’s sick 🔥).
So some weeks ago, I visited the Spotify API website to view its documentation, endpoints, and all that. On getting there, I was baffled and maybe stumped, although it wasn’t my first time using an API, but this was different. From my brief experience, it was supposed to be like a direct GET request to a songs or artists endpoint or whatever, but man there were tokens and Auth flows, client ids and secrets, ugh. Like the average dev, I began to feel that perhaps their documentation was the problem — maybe it wasn’t straightforward, after all, I’d used an API before. After spending some hours skimming through different pages, looking for a supposedly ‘easy’ or straightforward instruction, I eventually left it to focus on my then HNG internship, considering it was more important and getting pretty intense.
Yesterday or the day before I think, I returned to the website, and it still felt as complicated as before, but I was determined (was I? maybe stubborn lol) to figure it out. Yesterday I was watching an ‘intro to backend’ video from one of my earlier web dev courses (Just started learning Node.JS), and he introduced Postman. It wasn’t my first time hearing about it (in fact I saw a joke on twitter about it recently; check here, and the comments and quote tweets for a bonus). So I eventually downloaded it and played around. It seemed very impressive and smooth.
Fast-forward to today, I decided to dig into the documentation once and for all, and it turned out it wasn’t all that bad. I just wasn’t ready to sit down and read the docs and understand it, perhaps because I was excited about what I could build, how cool it might be and couldn’t wait to get started, or it seemed complicated at first glance; and all this is just stress along the way. But to be honest, it wasn’t complicated at all.
I got to the Auth flows page and looked at the different options, there were four, but only one had what I needed, a flow that wouldn’t require any user login. So I chose that and went to its documentation. The first step was a POST request, and I obviously couldn’t do that through the browser, and I wasn’t in the mind-frame to write code. Viola! Postman to the rescue. That made me happy considering I might not have watched that video earlier. So basically, it was two steps: First, I post my client id and client secret to the accounts endpoint to get a token. Second, this token is what I’ll use for all future requests to the main API.
To get a bit into details:
On creating an ‘app’ on my Spotify developer Dashboard (I already had a Spotify account), I got a client id and client secret, but to receive responses from the API, I needed a token. To get this, I send both my client id and secret [encoded as a base64 string] in my request header as the Authorization parameter value and also send a specified key: value pair in the request body. Then set the application type (is that what it’s called?) to x-www-form-urlencoded.
Mistakes I made along the way (as nobody’s perfect 😅)
- At first, I used the wrong endpoint. 🤦🏿♀️
- I mentioned I was using Postman, right?. Then I mistakenly added the body data as a query parameter instead.
- I also forgot to set the application type to x-www-form-urlencoded.
- And finally, I didn’t encode my client id and secret. It took a while before I understood what I should do as this was new to me. When I eventually realized, I searched for base64 encoding, which led to to a StackOverflow page where I not only found a solution but learned a bit. If you’re curious, I used this tool to encode.
But ultimately, I did what I was meant to do and got my response, which contained my access token (yay).
Takeaways:
- It might not be so complicated at times. You might just need to calm down and read or take a break if needed. Also, I know it’s cliche but use Google to search for stuff you don’t understand. It’s a very important skill.
- Appreciate developer tools. Using Postman made all this relatively faster. I would have had to set up a JS file and send requests using fetch and probably log responses to the console. That isn’t so bad in itself, but it would take longer and all considering I just wanted to check out the API first.
- Another thing I later realized was in play here was my relative inexperience on the subject. On some further reading, I learned the Auth flows were actually the grant types specified in the Oauth2.0 authorization framework, which a lot of APIs use. There’s a lot I still don’t know. But oh well, we learn every day.
Well, that’s all for now. If you liked this I’d love if you let me know in the comments 🙂
Till next time
