Spotify Play Button: handle play/stop programmatically

Question

I have several Spotify Play Buttons generated from here https://developer.spotify.com/documentation/widgets/generate/play-button/

Each play button is independent and generated through an iframe, I would like to know if there is a way to programmatically handle the play/stop events. The goal is to prevent to have more than one Play Button can play music at the same time, thus if a user start playback on Play Button 1, I would like to stop playback on all the other Play Button.

Is this possible, considering that the iframe is on the Spotify domain?

Answer 1

Due to the restrictions of same origin policies in browsers, if you embed an iframe on your website/page you do not have access to it since it is from another domain.

The play button inside the iframe does not have any observable events that you can initiate a click on. I did work for 20 minutes trying to initiate a click on the frame, did not work.

I suggest finding a solution elsewhere in the documentation, another method to achieve your goals. I have no idea what other things they offer.

Spotify: https://developer.spotify.com/documentation/web-api/libraries/