Search⌘ K
AI Features
Home
Courses
Integrate the Spotify API in JavaScript

Manage Tracks in User’s Profile

Explore how to manage tracks in a Spotify user's profile by using the API's PUT method to save tracks and DELETE method to remove tracks. Understand request parameters, HTTP calls, and handle responses to successfully update user track data.

We'll cover the following...

Manage user's tracks

In this lesson, we'll use two types of HTTP requests. One is used to save a track to a user profile, whereas the other is used to remove a track from a user profile.

The base URL https://api.spotify.com/v1/me/tracks is used to save or delete tracks from the current user's profile. The PUT request saves the track, whereas a DELETE request removes the specified track from the user's profile.

Request parameters

The endpoint to manage user's tracks has the following query parameter:

Query parameter

Category

Type

Description

ids

Required

String

This contains the IDs of the tracks we want to save in the current user's profile. These IDs are separated by a comma (,). We can save a maximum of 20 tracks with one call.

The table below contains the body parameter of this endpoint.

Body parameter

Category

Type

Description

ids

Optional

String

This contains the IDs of the tracks we want to save or delete from the current user's profile. These IDs are separated by a comma (,). We can save or delete a maximum of 50 tracks with one call using this parameter. If we use the ids query parameter, the IDs listed here will be overridden.

Let's look at how to use this endpoint to save tracks to a user profile. The code below shows how to use this endpoint with the query parameter ids.

Javascript (babel-node)
const endpointUrl = new URL('https://api.spotify.com/v1/me/tracks');
const queryParameters = new URLSearchParams({
  ids: '4rHZZAmHpZrA3iH5zx8frV,3C0nOe05EIt1390bVABLyN'
  //4rHZZAmHpZrA3iH5zx8frV is the Spotify ID for the song Mirrors
  //3C0nOe05EIt1390bVABLyN is the Spotify ID for the song On the Floor
});
headerParameters = {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer {{AUTHORIZATION_CODE_ACCESS_TOKEN}}'
}
const options = {
  method: 'PUT',
  headers: headerParameters
};
async function saveTrack() {
  try {
    endpointUrl.search = queryParameters;
    const response = await fetch(endpointUrl, options);
    printResponse(response);
  } catch (error) {
    printError(error);
  }
}
saveTrack();

Following is the explanation for the code given above:

  • Line 1: We update the URL to https://api.spotify.com/v1/me/tracks.

  • Lines 3–7: We add query parameters.

  • Line 15: We set the request type to PUT.

  • Line 19–27: We define a function named saveTrack() that calls the endpoint and prints the response.

Now, let's run an example where we use this endpoint to remove some tracks from the user’s profile. The code below shows how to send a DELETE request to delete a track from a user profile.

Javascript (babel-node)
const endpointUrl = new URL('https://api.spotify.com/v1/me/tracks');
const queryParameters = new URLSearchParams({
  ids: '3C0nOe05EIt1390bVABLyN'
  //3C0nOe05EIt1390bVABLyN is the Spotify ID for the song On the Floor
});
headerParameters = {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer {{AUTHORIZATION_CODE_ACCESS_TOKEN}}'
}
const options = {
  method: 'DELETE',
  headers: headerParameters
};
async function removeTrack() {
  try {
    endpointUrl.search = queryParameters;
    const response = await fetch(endpointUrl, options);
    printResponse(response);
  } catch (error) {
    printError(error);
  }
}
removeTrack();

Let's look at the changes we made in the code:

  • Line 14: We change the request type to DELETE.

  • Line 18: We change the function's name to removeTrack().

Response fields

In case of a successful request, the response of this endpoint doesn't have any content and contains only status_code (200). In response to an unsuccessful request, we get a message in the response, that tells us what went wrong.