Plan
Premium
Country
Australia
Device
PC, Windows 10, firefox or chrome
I'm trying to use the access token which returns after I log in to my premium account, it does work then i get the access token and try to use it to connect the sdk player.
Here is my code:
login.php
// Set your Spotify Developer Dashboard credentials
$CLIENT_ID = "01fa3cc8d7b44edcbe76ec15ed40255b";
$REDIRECT_URI = "https://musictree.app/indexFull.php";
$SCOPE = "user-read-private user-read-email user-read-playback-state user-modify-playback-state user-read-currently-playing streaming";
$STATE = "your_unique_state_value"; // Optional state parameter for security
// Spotify Authorization URL
$AUTHORIZATION_URL = "https://accounts.spotify.com/authorize";
// Construct the authorization URL
$auth_url = "{$AUTHORIZATION_URL}?client_id={$CLIENT_ID}&response_type=code&redirect_uri={$REDIRECT_URI}&scope={$SCOPE}&state={$STATE}";
?>
<!DOCTYPE html>
<html>
<head>
<title>Spotify Authorization</title>
</head>
<body>
<p>Authorize your app by visiting the following URL:</p>
<a href="<?php echo $auth_url; ?>"><?php echo $auth_url; ?></a>
</body></html
index.php
<script>
// Function to get the value of a URL parameter by name
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)');
var results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
const tracks = <?php echo json_encode($tracks); ?>;
let currentTrackIndex = -1; // To keep track of the current playing track
let player;
// Initialize the Spotify Web Playback SDK
window.onSpotifyWebPlaybackSDKReady = () => {
// Try to get the access token from the URL
const urlAccessToken = getParameterByName('code');
const token = urlAccessToken; // Replace with a default value
console.log('Access Token:' + urlAccessToken);
const player = new Spotify.Player({
name: 'two',
getOAuthToken: (cb) => { cb(token); }
});
player.connect().then(success => {
if (success) {
console.log('Connected to Spotify Web Playback SDK');
} else {
console.error('Failed to connect to Spotify Web Playback SDK');
}
});
player.addListener('ready', ({ device_id }) => {
console.log('The Web Playback SDK is ready to play music!');
console.log('Device ID', device_id);
})
};
// Function to play a specific track
function playTrack(trackUri) {
if (player) {
player
.play({ uris: [trackUri] })
.then(() => {
console.log('Playing track: ' + trackUri);
})
.catch(error => {
console.error('Error playing track: ' + error);
});
}
}
// Function to pause the track
function pauseTrack() {
if (player) {
player.pause().then(() => {
console.log('Track paused');
});
}
}
// Function to play the next track
function playNextTrack() {
currentTrackIndex++;
if (currentTrackIndex < tracks.length) {
const trackUri = tracks[currentTrackIndex].uri;
playTrack(trackUri);
} else {
// Reset the index when all tracks are played
currentTrackIndex = -1;
pauseTrack();
}
}
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('authentication_error', ({ message }) => {
console.error(message);
});
player.addListener('account_error', ({ message }) => {
console.error(message);
});
The login goes to spotify, asks me to login/approve and then redirects to index.php showing the code in the url:
I then get these errors:
Some cookies are misusing the recommended “SameSite“ attribute 3
Firefox can’t establish a connection to the server at wss://gae2-dealer.spotify.com/?access_token=AQACo2fUk6_5u9WlrNMi8o9I0tR9OsW3FLAYniRVSXgAE_2NYqwhcZ-kNUo5lPtIQZ8k_YIBvJ0RXjSPiQGTXDHGfREGmRj6uDlqqSwfJtuk1CAFMbZRxzJr-SwBYFV1tYqBm1l8i-ecN_0yzKeAKtjomGJ57pa0yyXm2gvOU31-gmNqtGNlu_dRwRWOkTEdqwmqWensCE9KljworJrd_WIsNjoRWxFKAIPsk2ih27JyxD52pVLbHJ0qvDIXmHCAXH4Z9KGZmThDClzjK87CK2pHMEmF0ab7vkrvUoXJfKAnBoPE_ABrmHvQvCuSR1pVTN47GY_zqt4XFJBg6lnQjjuIY3GHzM2LGA. index.js:18:43008
Firefox can’t establish a connection to the server at wss://gae2-dealer.spotify.com/?access_token=AQACo2fUk6_5u9WlrNMi8o9I0tR9OsW3FLAYniRVSXgAE_2NYqwhcZ-kNUo5lPtIQZ8k_YIBvJ0RXjSPiQGTXDHGfREGmRj6uDlqqSwfJtuk1CAFMbZRxzJr-SwBYFV1tYqBm1l8i-ecN_0yzKeAKtjomGJ57pa0yyXm2gvOU31-gmNqtGNlu_dRwRWOkTEdqwmqWensCE9KljworJrd_WIsNjoRWxFKAIPsk2ih27JyxD52pVLbHJ0qvDIXmHCAXH4Z9KGZmThDClzjK87CK2pHMEmF0ab7vkrvUoXJfKAnBoPE_ABrmHvQvCuSR1pVTN47GY_zqt4XFJBg6lnQjjuIY3GHzM2LGA. index.js:18:43008
Failed to connect to Spotify Web Playback SDK
Any help would be appreciated. I actually got this working with other scopes for making playlists, but it isn't working with the Web Playback SDK
Thanks,
Kias
