I am working on an app in Angular-Meteor with xinranxiao:spotify-web-api package,which is built off of spotify-node-api & xinranxiao:meteor-accounts-spotify package to login with spotify.
I can login successfully with spotify by creating a client Id and client Secret provided by Spotify Web Api and a redirect uri which is just http://localhost:3000/_oauth/spotify?close
. I have a page where I list the users playlists and it shows the album artwork. Just below the album artwork I place spotify's frame player with the link to the above album/playlist but there's a 401 error. Need authentication
.
I have logged in but I still need authentication ?
If i type Meteor.loginWithSpotify()
in my chrome browser console, I get undefined and I don't see my access token? How Can I obtain my access token and refresh it ? I believe this is the cause for it showing I still need authentication and why if I type Meteor.loginWithSpotify()
I get undefined
.
In my server side Meteor code I have:
ServiceConfiguration.configurations.update(
{ "service": "spotify" },
{
$set: {
"clientId": "000000000000000000000000000000",
"secret": "000000000000000000000000000000"
}
},
{ upsert: true }
)
In my client side Meteor Methods I have a getUserPlaylists Method which does what it says and it works. Below it is a method checkTokenRefreshed which I am still not sure if it's refreshing the token?:
Meteor.methods({
// Get a user's playlists
getUserPlaylists: function() {
//Spotify call
var spotifyApi = new SpotifyWebApi()
//response object
var userplaylists = spotifyApi.getUserPlaylists(Meteor.user().profile.id,function(err,data){
if(err){
console.log("Retrieval error ", err)
}
else{
console.log("Success, your playlist ", data.body)
}
})
//Need to refresh token
if(checkTokenRefreshed(userplaylists, spotifyApi)){
userplaylists = spotifyApi.getUserPlaylists(Meteor.user().profile.id,function(err,data){
if(err){
console.log("Retrieval error ", err)
}
else{
console.log("Success, your playlist ", data.body)
}
})//end response
}//end checkTokenRefreshed
return userplaylists
}//end getUserPlaylists
})//end Meteor.methods
var checkTokenRefreshed = function(response, api) {
if (response.error && response.error.statusCode === 401) {
api.refreshAndUpdateAccessToken();
return true
} else {
return false
}
}
In my client side code I have:
var options = {
showDialog: true, // Whether or not to force the user to approve the app again if they’ve already done so.
requestPermissions: ['user-read-email','playlist-modify-private', 'user-library-read','user-follow-read', 'playlist-read-private','streaming'] // Spotify access scopes.
};
var scopes = ['user-read-email','playlist-modify-private', 'user-library-read','user-follow-read', 'playlist-read-private','streaming']
Accounts.ui.config({'requestPermissions':{'spotify':scopes}})
Meteor.loginWithSpotify(options, function(accessToken) {
console.log('accessToken is ', accessToken)
});
The last method of the client side code should print my accessToken to the console but instead it prints accessToken is undefined
I should mention I can access a users playlist with node/meteor-spotify-web-api spotifyApi.getUserPlaylists() methods, but what good does that do if I can't post the link to it without getting a 401 error
The documentation for xinranxiao:meteor-spotify-api says 2) Get an oauth access_token, either through xinranxiao:accounts-spotify, or directly through this API (refer here. ) for how).