yervote.blogg.se - Spotify developer login

Our callback function doesn’t need to do much just receive an authentication code from Spotify when we initially connect to the API. Our last setup step is to configure our netlify.toml so Netlify knows where to look for our site files and Lambda function files: publish = 'src' functions = 'functions'Īnd it’s as simple as that, folks. We’ll put some very basic HTML in our index.html file for now, just to make sure everything’s working. Once we’ve gone through these steps, our project directory ought to look something like this: functions/

(The -y flag on npm init just accepts the default options so we can breeze through this.)

We’ll also initialize an npm project so we can run the development functions. This is the function that will capture our initial authentication information from Spotify. In the src directory, we’ll create an index.html, and in functions we’ll make a file callback.js. We’ll create a new directory for this project, and in it we’ll create two directories, src and functions, as well as a netlify.toml file, which will contain our Netlify Functions configuration. That’s all we need for initial project set up. Then we can use the CLI to log in to our Netlify Account: netlify login To install Netlify CLI globally on our machine, we’ll run the following in our terminal: npm install netlify-cli -g Node/NPM will let us set up the Netlify CLI tool that makes using Netlify functions Really Quite Convenient, and we’ll use Postman as an interstitial step during authentication. ⚠️ This is probably not the way to make a very very secure serverless auth loop! ⚠️ It’s just a fun tech demo. That would probably require a database and other infrastructure, and we don’t need that noise to make this work. This article won’t cover a fully-featured loop for managing authentication, refresh tokens, refresh timeout, etc.

Writing a Netlify Function to request data from the Spotify API.

Authenticating that app using Postman and Netlify Dev.

Setting up an app in Spotify For Developers.

Writing a basic callback function for Spotify authentication.

Setting up a basic application to display our track info.

Here’s a basic outline of what we’re going to do to get this working today:

Or check out the deployed version of this site.

Check out the code for this at the GitHub Repo.

While the authorization flow for Spotify’s API initially threw me for a bit of a loop, this became a really fun way to spend an hour or two. It’s an easy way to show some personality, and mostly just an excuse to get friendly with Netlify Functions. It wasn’t recently, it was in July, please don’t look behind the curtain. I recently* built this really cool feature for my personal website that allows me to use Netlify Functions to show my most-recently-listened-to tracks from Spotify.