Jammming Project - Adding Playing a Preview of a Track

Hi I am trying to do the Jammming feature request to include preview samples for each track, but I am having trouble with how to implement it.

I have managed to get the preview to play how I want it by having the Track component update the state of the Tracklist with the track’s preview url, but the problem I am having is making the button that is rendered by the Track component change from PLAY to PAUSE.

The Tracklist has no knowledge of the actual component where the PLAY button was clicked so I am not sure how to update it when a new PLAY button is clicked.

I only want 1 track to be playing at a time and only 1 button to say PAUSE at any given time.

Anyone give me some clue on how to implement this?

1 Like

I’m having the same problem. I haven’t found anyway to interact with the api and play a preview of each song.

I figured it out.

I will give you some hints on how to do it.
You can pretty easily get the url to the preview clip when you use the Search API to get the search results.

Then just use that url to play the preview.

Thanks, I figured it out. I was also able to play the preview within the webpage using the Audio element and get the preview link from the api response.

Hello! I know this was a while ago for you but I’m trying to implement previews too… is there something built in for this? Can you give me a hint please as to what it is?

Look at this: Web API Reference | Spotify for Developers

There is a field from the API that has what you need.

Is that what you are looking for?


Thanks so much! Yes, that! I was looking at other people’s code and saw preview_url but didn’t know where it came from! I have taken a different approach and used iframe. I’m not sure if I should start again or continue with iframe. The thing with iframe is that it doesn’t play a preview but plays the whole track.