Search code examples
javascriptspotify

Spotify Playback Quickstart not playing music


I'm following the playback SDK quickstart link here but for whatever reason I am unable to play music.

Here is my code

<!DOCTYPE html>
<html>
  <head>
    <title>Spotify Web Playback SDK Quick Start</title>
  </head>
  <body>
    <button id="togglePlay">Toggle Play</button>
    <h1>Spotify Web Playback SDK Quick Start</h1>

    <script src="https://sdk.scdn.co/spotify-player.js"></script>
    <script>
      window.onSpotifyWebPlaybackSDKReady = () => {
        const token ='mytokenhere';
        const player = new Spotify.Player({
          name: "Web Playback SDK Quick Start Player",
          getOAuthToken: (cb) => {
            cb(token);
          },
          volume: 0.5,
        });

        // Ready
        player.addListener("ready", ({ device_id }) => {
          console.log("Ready with Device ID", device_id);
        });

        // Not Ready
        player.addListener("not_ready", ({ device_id }) => {
          console.log("Device ID has gone offline", device_id);
        });

        player.addListener("initialization_error", ({ message }) => {
          console.error(message);
        });

        player.addListener("authentication_error", ({ message }) => {
          console.error(message);
        });

        player.addListener("account_error", ({ message }) => {
          console.error(message);
        });

        document.getElementById("togglePlay").onclick = function () {
          player.togglePlay();
        };

        player.connect();
      };
    </script>
  </body>
</html>

I see in my console that the player is ready, but I do not see the player anywhere nor do i hear music. Am i missing something?


Solution

  • I'm new to answering questions but maybe I can help until someone more knowledgeable than me chimes in.

    The code you have doesn't actually display a player, it will just broadcast what you have playing from another Spotify client.

    If you play Spotify from your account on your phone for example, you should see the SDK as a device to cast to. See image: Web Playback SDK Quick Start Player player using another Spotify client

    If you still don't hear the music coming from the browser, also try generating a new access token.