1
votes

I am trying to integrate web API to get currently playing/recently played songs. But, I could not generate the token with the scopes (user-read-currently-playing, user-read-playback-state).

I followed this link as refrence of Spotify. https://developer.spotify.com/web-api/authorization-guide/

1 https://accounts.spotify.com/authorize/?client_id=[CLIENT_ID]&response_type=code&redirect_uri=https%3A%2F%2Fexample.com%2Fcallback&scope=user-read-currently-playing%20user-read-playback-state&state=34fFs29kd09

I am getting bellow HTML response.

<html ng-app="accounts" ng-csp="">
<head>
<meta charset="utf-8">
<title ng-bind="(title &amp;&amp; (title | localize) + ' - ') + 'Spotify'">Spotify</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<base href="/">
<link href="https://d2d1dxiu3v1f2i.clou..." media="screen" rel="stylesheet">
<script async="" defer="" src="https://d2d1dxiu3v1f2i.clou..." sp-bootstrap=""></script>
<meta ng-non-bindable="" sp-bootstrap-data="">
</head>
<body ng-view=""></body>
</html>

Please help. Thank you

1
Is it returning a HTTP status code?StevenOjo

1 Answers

1
votes

It looks like you've slightly misunderstood the auth procedure - in the authorization code flow the first step is to present that page to your user. You can do this in an iframe, a popup, in the original window - however you like. Once the user has granted or declined permission on that page, they will be redirected back to your app using the redirect URI.

To complete the authorization code flow, you have to exchange the code you get in the redirect for an access token and a refresh token. To perform this exchange, you'll need the client server - which mustn't be stored in your web frontend. You'd need a backend that'll do the exchange and forward the user to your frontend with the access token. If you don't have a backend, you can use the implicit grant flow.

Hope that helps!

Hugh