[ESP8266] verbinden en weergeven song info Spotify

[zekerpixels]

Beste Tweakers,

Kan iemand mij verder op weg brengen / spotten waar het fout gaat.
Ik ben met een projectje bezig waarbij ik wil weergeven wat er via spotify wordt afgespeeld. (nummer, album, artiest) Deze informatie wil ik in een string op de ESP8266 hebben, welke vervolgens gebruikt wordt om de verdere elektronica aan te sturen.

Aangezien ik geen flauw idee heb hoe ik deze info van spotify kan krijgen, ben ik bij het googlen het volgende tegengekomen. https://github.com/ThingPulse/esp8266-spotify-remote
Hierbij het idee dit als basis te gebruiken voor het spotify deel werkend te krijgen, waarbij het display deel eruit te slopen en vervolgens mij eigen deel eraan toe te voegen. Wat ik nu probeer van elkaar te krijgen is de communicatie met Spotify op gang te krijgen, waarna ik de song info ed. kan doorsturen naar de seriële monitor.

Wat heb ik al en wat werkt al:
- Het elektronica deel werkt al, ik heb alleen nog de informatie van spotify nodig.
- Verbinden met wifi
- Spotify app aangemaakt, dus client id en client secred
- Ik heb alle code welke met het display te maken heeft gecomment

Het probleem wat ik nu eigenlijk nog steeds heb, is dat verbinden met spotify niet lekker gaat. De gebruikte code is hetzelfde van het github linkje, alleen het display is eruit gesloopt zodat het geen fouten geeft. Ik ben voor nu alleen geinserreteerd in het opzetten van de verbinding (onderstaand de output op de seriële monitor)
Wat ik terug krijg is "400 Bad Request" en "Only valid bearer authentication supported", hiermee kom ik eigenlijk niet verder. Tweede puntje achter "Refresh token:" en "Access Token:" staat niks, dit lijkt mij niet de bedoeling, maar heb nog niet kunnen achterhalen waarom dit zo is.

Onderstaand de output op de seriële monitor: Tussen "<<<" en ">>>" de info dit ik heb vervangen en cursief welke ik heb bijgevoegd in de onderstaande output

code:

connecting to WiFi.
WiFi connected
IP address: <<<123.456.7.89>>>
mDNS responder started
Loading config
Failed to open config file
No refresh token found. Requesting through browser
Open browser at http://esp8266.local
<<<Hier blijf de code elke reset hangen totdat het linkje wordt benaderd, dit moet anders mogelijk zijn, maar voor nu geen probleem. Als ik het linkje in de browser benader krijg ik "Succesfully authentiated This device with Spotify. Restart your device now" te zien.>>>
WiFi not connected!
HTTP server started
<<<Client ID>>>
http%3A%2F%2Fesp8266.local%2Fcallback%2F
Code: <<<lange code>>>-f
Requesting URL: POST /api/token HTTP/1.1
Host: accounts.spotify.com
Authorization: Basic <<<lange code>>>=
Content-Length: 425
Content-Type: application/x-www-form-urlencoded
Connection: close
grant_type=authorization_code&code=<hele lange code>-f&redirect_uri=http%3A%2F%2Fesp8266.local%2Fcallback%2F
Refresh token: 
Access Token: 
Loop
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close
HTTP/1.1 400 Bad Request
HTTP Code: 400
Content-Type: application/json
Content-Type: application/json
WWW-Authenticate: Bearer realm="spotify", error="invalid_request", error_description="Only valid bearer authentication supported"
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: Accept, Authorization, Origin, Content-Type, Retry-After
Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE, PATCH
Access-Control-Allow-Credentials: true
Access-Control-Max-Age: 604800
Content-Length: 99
Date: Fri, 00 Dec 2018 00:00:00 GMT
Via: 1.1 google
Alt-Svc: clear
Connection: close

Als iemand nog info heeft om op een andere methode deze info stand-allone van spotify te krijgen, ben ik natuurlijk geinteresserd.

[ Voor 7% gewijzigd door zekerpixels op 09-12-2018 23:35 ]

[teaser]

Heb je dit hoofdstukje gelezen op de github pagina over het verkrijgen van toegang tot de Spotify API? Je moet eerst registreren en een API key verkregen vooraleer je iets met de API kunt doen.

[zekerpixels]

teaser schreef op zaterdag 8 december 2018 @ 10:53:
Heb je dit hoofdstukje gelezen op de github pagina over het verkrijgen van toegang tot de Spotify API? Je moet eerst registreren en een API key verkregen vooraleer je iets met de API kunt doen.

De stapjes onder "Get Access to the Spotify API" heb ik inderdaad doorlopen, want daar komen de Client ID en Client Secret vandaan. Welke natuurlijk samen met de WiFi gegegvens in Setting.h zijn ingevuld.
Het deel van de calback blijkt ook te werken, want wanneer de seriële monitor aangeeft "Open browser at http://esp8266.local". Als ik deze benader met de browser dan komt het bericht "Succesfully authentiated This device with Spotify. Restart your device now" afkomstig van "String SpotifyClient::startConfigPortal()" in SpotifyClient.cpp.

ik heb via de waybackmachine de pagina https://developer.spotify...tion/web-api/quick-start/ en https://developer.spotify...uide/#implicit-grant-flow van 23 juni 2018 vergeleken met de huidige versie, maar deze blijken exact hetzelfde te zijn.

Edit:
Ik heb nu de gehele code met libaries ongewijzigd van github, alleen de gegevens in setting.h heb ik ingevuld, om zo inderergeval uit te sluiten dat mijn gerommel in de code iets verstoord heeft.

code:

[b]Output op de seriële monitor:[/b]
[small][i]Tussen "<" en ">" de info dit ik heb vervangen en cursief welke ik heb bijgevoegd in de onderstaande output[/i][/small]
connecting to WiFi.
WiFi connected
IP address: <123.456.7.89>
mDNS responder started
Loading config
Failed to open config file
No refresh token found. Requesting through browser
Open browser at http://esp8266.local
[i]<Hier blijf de code hangen totdat het linkje wordt benaderd, dit moet anders mogelijk zijn, maar voor nu geen probleem. Als ik het linkje in de browser benader krijg ik "Succesfully authentiated This device with Spotify. Restart your device now" te zien.>[/i]
WiFi not connected!
HTTP server started
<Client ID>
http%3A%2F%2Fesp8266.local%2Fcallback%2F
Code: <lange code>-f
Requesting URL: POST /api/token HTTP/1.1
Host: accounts.spotify.com
Authorization: Basic <lange code>=
Content-Length: 425
Content-Type: application/x-www-form-urlencoded
Connection: close
grant_type=authorization_code&code=<hele lange code>-f&redirect_uri=http%3A%2F%2Fesp8266.local%2Fcallback%2F
Refresh token: 
Access Token: 
Loop
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

HREF: 
--------Response Code: 0
--------Free mem: 25000
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

HREF: 
--------Response Code: 0
--------Free mem: 25672
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

HREF: 
--------Response Code: 0
--------Free mem: 25504
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

HREF: 
--------Response Code: 0
--------Free mem: 25336
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

HREF: 
--------Response Code: 0
--------Free mem: 25168
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

Blijkbaar heeft mijn gerommel iets verstoord, want de ik krijg geen "400 Bad Request" en "Only valid bearer authentication supported" meer.
Maar, het doel is natuurlijk iets van informatie weer te kunnen geven, hiervoor heb een van de onderstaande regels code toegevoegd aan de loop() om zo te proberen of er iets wordt ontvangen.

C:

Serial.print("progressMs     ");     Serial.println(data.progressMs);
Serial.print("durationMs     ");     Serial.println(data.durationMs);
Serial.print("title          ");     Serial.println(data.title);
Serial.print("artistname     ");     Serial.println(data.artistName);
Serial.print("isPlaying      ");     Serial.println(data.isPlaying);
Serial.print("isPlayerActive ");     Serial.println(data.isPlayerActive);

Onderstaand de regels welke op de seriële monitor worden weergegeven.

code:

progressMs     0
durationMs     0
title          
artistname     
isPlaying      0
isPlayerActive 0

Wat opvalt is dat nadat "http://esp8266.local" wordt benaderd, "WiFi not connected!" naar de seriële monitor wordt gestuurd. Wat raar is wat mijn router geeft aan dat deze nog verbonden is. Verder achter "Refresh token:" en "Access Token:" staat niks, dit lijkt mij niet de bedoeling, maar heb nog niet kunnen achterhalen waarom dit zo is. Verder staat er "Authorization: Bearer ", waarachter ook de acesstoken geprint moet worden. (Line 59-64 in SpotifyClient.cpp). Dus het opzetten van een communicatie met Spotify gaat gewoon niet zoals het zou moeten.

[ Voor 158% gewijzigd door zekerpixels op 09-12-2018 22:39 ]

[teaser]

Ik vermoed niet dat die extra tracings iets verstoord hebben, er moet nog iets anders veranderd zijn. Echter, response code 0 is nog steeds niet wat je nodig hebt. Je zou een 200 moeten krijgen.

Die logging 'wifi not connected' komt vanuit SpotifyClient.cpp. Probeer daar eventueel ook eens een loopje in te steken zoals in de setup(), zien of die na even wachten toch goed komt?

PS: ik heb nog geen ervaring met ESP8266, maar er is er eentje onderweg uit China naar hier dus hopelijk leer ik hiervan ook al bij.

[zekerpixels]

Ik heb ondertussen stap voor stap doorlopen wat er gebeurt, volgens mij gaat het nog ergens met de tokens mis.

1. The third party application needs to get credentials. Spotify calls these credentials Client Id and Client Secret.
2. With these credentials the application requests access to the users resource. If this is the first time the user has to agree to it on a web page. If everything is OK Spotify redirects the web page back to the application together with a temporary access code
3. With this access code the application requests another access code which is valid for an hour. Together with this one hour token you also get a refresh token.
4. Now the application can start using the API by sending the access code and it’s own credentials to Spotify
5. Once the access code runs out the application can use the refresh token to request a new access code

1
Eerste uitvoer op de seriele monitor
Opmerkingen: er wordt gevraagd de esp8266 via de browser te benaderen, waarna er "WiFi not connected!" staat, wat raar is wat mijn router geeft aan dat deze nog verbonden is. Als deze niet meer verbonden zou zijn, loopt de code natuurlijk na het benaderen van het linkje ook niet door.

code:

connecting to WiFi
.
WiFi connected
IP address: 
<<<123.456.7.89>>>
mDNS responder started
Loading config
Failed to open config file
No refresh token found. Requesting through browser
Open browser at http://esp8266.local
WiFi not connected!
HTTP server started

2
Ik ga via de browser naar http://esp8266.local, hier krijg ik direct een redirect naar "Succesfully authentiated This device with Spotify. Restart your device now". (deze zin, staat in SpotifyClient.cpp op regel 289.) De url is hierbij gewijzigd naar "http://esp8266.local/callback/?code=<<<lange code>>>"

Als ik kijk naar de "Authorization Code Flow" onder 1. example.

If the user accepts your request, the response query string,
for example https://example.com/callb...&state=profile%2Factivity, contains the following parameters:
QUERY PARAMETER VALUE
code An authorization code that can be exchanged for an access token.
state The value of the state parameter supplied in the request.

If the user does not accepted your request or an error has occurred, the response query string,
for example https://example.com/callb...access_denied&state=STATE, contains the following parameters:
QUERY PARAMETER VALUE
error The reason authorization failed, for example: “access_denied”
state The value of the state parameter supplied in the request.

Aangezien de redirect naar "/callback?code=" is en niet naar "/callback?error=", kan ik hieruit afleiden dat ik met het benaderen van http://esp8266.local toestemming heb gegeven.

3
Uitvoer in de seriële monitor na het benaderen met de browser
De <<<lange code>>> is hetzelfde als in de redirect link word weergegeven

code:

<<<Client ID>>>
http%3A%2F%2Fesp8266.local%2Fcallback%2F
Code: <<<dezelfde lange code als in de redirect link>>>
Requesting URL: POST /api/token HTTP/1.1
Host: accounts.spotify.com
Authorization: Basic <<<andere lange code>>>=
Content-Length: 425
Content-Type: application/x-www-form-urlencoded
Connection: close

4
vervolg van de seriële output
Opmerkingen: Achter "Refresh token:" en "Access Token:" staat niks

code:

grant_type=authorization_code&code=<<<weer dezelfde lange code>>>redirect_uri=http%3A%2F%2Fesp8266.local%2Fcallback%2F
Refresh token: 
Access Token: 
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

5
vervolg van de seriële output

code:

HREF: 
--------Response Code: 0
--------Free mem: 25000
Requesting URL: GET /v1/me/player/currently-playing HTTP/1.1
Host: api.spotify.com
Authorization: Bearer 
Connection: close

teaser schreef op zondag 9 december 2018 @ 11:50:
[...] Echter, response code 0 is nog steeds niet wat je nodig hebt. Je zou een 200 moeten krijgen. [...]

https://developer.spotify...ides/authorization-guide/
An alternative way to send the client id and secret is as request parameters (client_id and client_secret) in the POST body, instead of sending them base64-encoded in the header. On success, the response from the Spotify Accounts service has the status code 200 OK in the response header, and the following JSON data in the response body:

KEY	VALUE TYPE	VALUE DESCRIPTION
access_token	string	An access token that can be provided in subsequent calls, for example to Spotify Web API services.
token_type	string	How the access token may be used: always “Bearer”.
scope	string	A space-separated list of scopes which have been granted for this access_token
expires_in	int	The time period (in seconds) for which the access token is valid.
refresh_token	string	A token that can be sent to the Spotify Accounts service in place of an authorization code. (When the access code expires, send a POST request to the Accounts service /api/token endpoint, but use this code in place of an authorization code. A new access token will be returned. A new refresh token might be returned too.)

[ Voor 39% gewijzigd door zekerpixels op 09-12-2018 22:42 ]

[zekerpixels]

Ik heb ook op circuitonline.net een topic gestart, daarbij heeft de gebruiker DeTijdTikt meegedacht.

Ik het kort het commenten van de return op op regel 238 van SpotifyClient.cpp, zorgt ervoor dat het werkt.
Hierbij weer ik nog niet waarom client.available() een 0 geeft.

C:

Serial.println(client.available());   // geeft een 0

[ Voor 129% gewijzigd door zekerpixels op 10-12-2018 13:13 ]