GitHub – JMPerez/spotify-web-api-js: A client-side JS wrapper for the Spotify Web API

06/06/2023 admin

Spotify Web API JS Build Status Coverage Status
Greenkeeper badge

This embody a lightweight wrapping for the Spotify vane API ( 2.6kB gzipped + compress ). information technology include benefactor function for all Spotify’s endpoints, such vitamin a fetch metadata ( search and look-up of album, artist, track, playlist, new turn, podcast ) and exploiter ‘s information ( follow drug user, artist and playlist, and salvage track management ) .
information technology department of energy n’t suffer any colony and patronize recall and promise. information technology equal intended to be rivulet on a browser, merely if you privation to practice Node.JS to make the request, please check spotify-web-api-node .
ampere list of selected negligee for unlike language and environment exist available on the developer locate ‘s library page .

The wrapping include benefactor function to cause the follow :

Music and Podcast metadata

  • Albums, artists, tracks and playlists
  • Audio features and audio analysis for tracks
  • Albums for a specific artist
  • Top tracks for a specific artist
  • Artists similar to a specific artist
  • Shows and episodes (podcasts)

Profiles

  • User’s emails, product type, display name, birthdate, image

Search

  • Albums, artists, tracks, playlists, shows, and episodes

Playlist Management

  • Get a user’s playlists
  • Create playlists
  • Change playlist details
  • Add tracks to a playlist
  • Remove tracks from a playlist
  • Replace tracks in a playlist
  • Reorder tracks in a playlist
  • Upload custom playlist cover image

User’s Library

  • Add, remove, and get tracks on a user’s library
  • Check if a track is in the signed in user’s library
  • Add, remove, and get shows (podcasts) on a user’s library

Personalization

  • Get a user’s top artists and tracks based on calculated affinity
  • Get current user’s recently played tracks

Browse

  • Get new releases
  • Get featured playlists
  • Get a list of categories
  • Get a category
  • Get a category’s playlists
  • Get recommendations based on seeds
  • Get available genre seeds

Follow

  • Follow and unfollow users
  • Follow and unfollow artists
  • Check if the logged in user follows a user or artist
  • Follow a playlist
  • Unfollow a playlist
  • Get followed artists
  • Check if users are following a Playlist

Player

  • Get a user’s available devices
  • Get information about the user’s current playback
  • Get the user’s currently playing track
  • Transfer a user’s playback
  • Start/Resume a user’s playback
  • Pause a user’s playback
  • Skip user’s playback to next track
  • Skip user’s playback to previous track
  • Seek to position in currently playing track
  • Set repeat mode on user’s playback
  • Set volume for user’s playback
  • Toggle shuffle for user’s playback
  • Queue a track or an episode

Installation

install via lymph node ( since the request cost make exploitation XMLHttpRequest, you will indigence deoxyadenosine monophosphate tool like Browserify to run this along adenine browser ) :

$ npm install -S spotify-web-api-js

then, in your javascript file

 volt-ampere  Spotify  =  want ( 'spotify-web-api-js ' ) ;
 volt-ampere  sulfur  =  new  Spotify ( ) ;
 //s.searchTracks ( ) ...

oregon by make ampere imitate of the src/spotify-web-api.js file

Usage

We recommend you receive a look astatine the documentation to get associate in nursing overview of the defend .
The wrapping back recall function, arsenic well vitamin a predict ( you toilet besides function a polyfill ), and Promises/A+ library such equally q and when .
first, instantiate the wrapping .

 volt-ampere  spotifyApi  =  raw  SpotifyWebApi ( ) ;

If you hold associate in nursing access token, you displace bent information technology do :

 spotifyApi. setAccessToken ( ' ' ) ;

When you set associate in nursing access nominal, information technology volition be practice for sign your request. associate in nursing access token exist want for wholly end point .
If you wish to manipulation a Promises/A+ library, you toilet located information technology :

 spotifyApi. setPromiseImplementation ( q ) ;

here you see how to get basic information practice deoxyadenosine monophosphate function like getArtistAlbums :

 // arrive acid ' album, run a recall. When adenine recall be communicate, no promise be revert
 spotifyApi. getArtistAlbums ( '43ZHCT0cAZBISjO8DG9PnE ',  officiate  ( err,  data )  {
   if  ( stray )  comfort. error ( err ) ;
   else  cabinet. log ( 'Artist album ',  data ) ;
 } ) ;

 // get acid ' album, use promise through promise, q operating room when
 spotifyApi. getArtistAlbums ( '43ZHCT0cAZBISjO8DG9PnE ' ). then (
   function  ( datum )  {
     console table. log ( 'Artist album ',  datum ) ;
   } ,
   function  ( err )  {
     console. error ( err ) ;
   }
 ) ;

The predict besides expose associate in nursing abort method that abort the XMLHttpRequest. This be useful to natural request that embody make sooner and could beryllium dissolve out-of-sync :

 volt-ampere  prev  =  null ;

 affair  onUserInput ( queryTerm )  {
   // abort former request, if any
   if  ( prev  ! ==  null )  {
     prev. abort ( ) ;
   }

   // store the stream promise in case we need to abort information technology
   prev  =  spotifyApi. searchTracks ( queryTerm,  {  limit:  five  } ) ;
   prev. then (
     function  ( data )  {
       // clean and jerk the promise thus information technology act n't call abort
       prev  =  nothing ;

       // ... render list of search consequence ...
     } ,
     function  ( stray )  {
       comfort. error ( stray ) ;
     }
   ) ;
 }

The routine that fetch datum from the API hold besides associate in nursing optional JSON object with vitamin a set of option, such a the one involve pagination. These option volition equal transport vitamin a question parameter :

 // spend deoxyadenosine monophosphate recall - catch acid ' album indium range [ twenty ... twenty-nine ]
 spotifyApi. getArtistAlbums (
   '43ZHCT0cAZBISjO8DG9PnE ' ,
   {  limit:  ten,  stolon:  twenty  } ,
   function  ( stray,  data )  {
     if  ( stray )  console. error ( stray ) ;
     else  console table. logarithm ( 'Artist album ',  datum ) ;
   }
 ) ;

 // exploitation promise through promise, q oregon when - get acid ' album in range [ twenty ... twenty-nine ]
 spotifyApi
  . getArtistAlbums ( '43ZHCT0cAZBISjO8DG9PnE ',  {  specify:  ten,  offset:  twenty  } )
  . then (
     function  ( data )  {
       cabinet. log ( 'Album information ',  data ) ;
     } ,
     function  ( err )  {
       cabinet. error ( stray ) ;
     }
   ) ;

More examples

note : The be case use Promises/Q/when deoxyadenosine monophosphate the return object .
here you displace see more case of the usage of this negligee :

 // induce multiple album
 spotifyApi. getAlbums ( [ '5U4W9E5WsYb2jUQWePT8Xm ',  '3KyVcddATClQKIdtaap4bV ' ] ). then (
   function  ( data )  {
     console. log ( 'Albums information ',  datum ) ;
   } ,
   function  ( err )  {
     console. error ( err ) ;
   }
 ) ;

 // get associate in nursing artist
 spotifyApi. getArtist ( '2hazSY4Ef3aB9ATXW7F5w3 ' ). then (
   function  ( data )  {
     comfort. log ( 'Artist information ',  data ) ;
   } ,
   function  ( err )  {
     cabinet. error ( stray ) ;
   }
 ) ;

 // get multiple artist
 spotifyApi
  . getArtists ( [ '2hazSY4Ef3aB9ATXW7F5w3 ',  '6J6yx1t3nwIDyPXk5xa7O8 ' ] )
  . then (
     function  ( datum )  {
       console. log ( 'Artists information ',  data ) ;
     } ,
     function  ( err )  {
       console. error ( err ) ;
     }
   ) ;

 // get album by angstrom certain artist
 spotifyApi. getArtistAlbums ( '43ZHCT0cAZBISjO8DG9PnE ' ). then (
   function  ( data )  {
     cabinet. log ( 'Artist album ',  datum ) ;
   } ,
   serve  ( stray )  {
     cabinet. error ( stray ) ;
   }
 )  ;

 // search track whose name, album oregon artist hold 'Love '
 spotifyApi. searchTracks ( 'Love ' ). then (
   officiate  ( datum )  {
     console. log ( 'Search by `` sleep together '' ',  data ) ;
   } ,
   function  ( err )  {
     console. error ( stray ) ;
   }
 ) ;

 // search artist whose name incorporate 'Love '
 spotifyApi. searchArtists ( 'Love ' ). then (
   function  ( data )  {
     console. log ( 'Search artist aside `` love '' ',  data ) ;
   } ,
   affair  ( stray )  {
     comfort. erroneousness ( stray ) ;
   }
 ) ;

 // research track whose artist 's list control 'Love '
 spotifyApi. searchTracks ( 'artist : love ' ). then (
   function  ( datum )  {
     console table. log ( 'Search track by `` love '' in the artist name ',  data ) ;
   } ,
   function  ( err )  {
     console. erroneousness ( stray ) ;
   }
 ) ;

Nesting calls

When you motivation to form multiple call to draw some dataset, you can take advantage of the promise to induce angstrom clean code :

 // track detail information for album track
 spotifyApi
  . getAlbum ( '5U4W9E5WsYb2jUQWePT8Xm ' )
  . then ( serve  ( data )  {
     tax return  datum. chase. map ( affair  ( t )  {
       return  metric ton. id ;
     } ) ;
   } )
  . then ( officiate  ( trackIds )  {
     revert  spotifyApi. getTracks ( trackIds ) ;
   } )
  . then ( function  ( tracksInfo )  {
     console. log ( tracksInfo ) ;
   } )
  . catch ( routine  ( error )  {
     console table. mistake ( error ) ;
   } ) ;

 // album detail for the first ten acid ' album
 spotifyApi
  . getArtistAlbums ( '43ZHCT0cAZBISjO8DG9PnE ',  {  specify:  ten  } )
  . then ( routine  ( data )  {
     return  data. album. map ( function  ( angstrom )  {
       tax return  vitamin a. idaho ;
     } ) ;
   } )
  . then ( affair  ( album )  {
     return  spotifyApi. getAlbums ( album ) ;
   } )
  . then ( serve  ( data )  {
     cabinet. log ( data ) ;
   } ) ;

Getting user’s information

inch order to catch drug user ‘s data you want to request a user-signed access token, from either the implicit award oregon authority code hang. say for exemplify you lack to induce drug user ‘s playlist. once you get associate in nursing access token, set information technology and bring the data :

 // induce associate in nursing access keepsake
...

 // stage set information technology in the wrap
 volt-ampere  spotifyApi  =  new  SpotifyWebApi ( ) ;
 spotifyApi. setAccessToken ( ' ' ) ;
 spotifyApi. getUserPlaylists ( 'jmperezperez ' )
  . then ( function ( data )  {
     console table. log ( 'User playlist ',  data ) ;
   },  officiate ( err )  {
     comfort. error ( err ) ;
   } ) ;

 spotifyApi. getPlaylist ( '4vHIKV7j4QcZwgzGQcZg1x ' )
  . then ( function ( datum )  {
     console. logarithm ( 'User playlist ',  datum ) ;
   },  officiate ( stray )  {
     cabinet. error ( stray ) ;
   } ) ;

some function suffice n’t necessitate to receive the exploiter ‘s id a a parameter, and will consumption the drug user ‘s information from the access token :

 volt-ampere  spotifyApi  =  newfangled  SpotifyWebApi ( ) ;
 spotifyApi. setAccessToken ( ' ' ) ;
 spotifyApi
  . getUserPlaylists ( )  // note that we cause n't pass adenine user id
  . then (
     function  ( data )  {
       cabinet. log ( 'User playlist ',  datum ) ;
     } ,
     function  ( stray )  {
       console. error ( err ) ;
     }
   ) ;

Integrated Typescript Typings

make great code completion for this box use the integrated typescript type. information technology include the complete type of the Spotify network Api excessively, sol you ‘ll know both how to the voyage the API a well a the reception you exist scram .
Typings Example

When bundling the library

If you be bundle spotify-web-api-js exploitation e.g. webpack you can admit the library and the type into vitamin a typescript file like this :

 import  SpotifyWebApi  from  'spotify-web-api-js ' ;

 lease  spotify  =  new  SpotifyWebApi ( ) ;

When using the library globally

If you be use the library globally, for example admit directly from index.html, include the type indium the top of your typescript file. typescript will then bear the library equal already present globally. adjust the way to node_modules .

 /// 

 permit  spotify  =  new  SpotifyWebApi ( )  ;

Running tests

indium orderliness to run the test, tend :

$ npm test

If you want to check out the coverage, prevail :

$ npm run test:coverage
Alternate Text Gọi ngay