Ich höre ständig Musik. Ich höre Musik, während ich arbeite, Spiele spiele, Hausarbeiten erledige oder so ziemlich alles andere mache.

Spotify eignet sich hierfür hervorragend. Es ist einfach zu bedienen und überträgt Musik nahtlos von Gerät zu Gerät, während ich mich in meinem Zuhause bewege. Manchmal frustriert es mich jedoch, dass ich ständig die verwendete Anwendung verlassen muss, um Songs oder Wiedergabegeräte zu ändern.

Mir wurde klar, dass ich wahrscheinlich nicht einzigartig bin und andere Leute sich wahrscheinlich auch darüber ärgern. Also beschloss ich, ein wiederverwendbares Spotify-Modul zu erstellen in Mendix, und jetzt kann ich grundlegende Steuerelemente für Spotify in jede App integrieren, die ich erstelle.

Bringen Sie Beats in Ihr Mendix Apps mit Spotify

Bei meinen Recherchen wurde mir klar, dass einige grundlegende Schritte erforderlich sind, damit dies funktioniert:

• Registrieren Sie die App bei Spotify
• Authentifizieren mit Spotify
  • Clientbasierte Anmeldeinformationen
  • Autorisierungscode
• Suche nach Titeln und Alben von Künstlern
• Starten Sie die Wiedergabe
• Verfügbare Geräte abrufen
• Übertragen der Wiedergabe zwischen Geräten

Im ersten Teil dieser Reihe erkläre ich Ihnen, wie Sie Ihre App bei Spotify registrieren, sich mit Client-Anmeldeinformationen authentifizieren und das erhaltene Token verwenden, um auf Spotify nach Titeln, Künstlern und Alben zu suchen.

Registrieren der App

Gehen Sie zur Spotify-Entwickler-Dashboard und melden Sie sich mit Ihrem Spotify-Konto an.

Klicken Sie auf App erstellen und geben Sie alle erforderlichen Angaben ein. Am wichtigsten ist, Legen Sie Ihre Weiterleitungs-URL fest auf Ihre Mendix app (mehrere URLs werden unterstützt, und localhost funktioniert gut). Sie können Umleitungs-URLs später jederzeit bearbeiten, hinzufügen und entfernen.

Klicken Sie beim Anzeigen Ihrer App in Spotify oben rechts auf „Einstellungen“, um die Client-ID und das Client-Geheimnis Ihrer App anzuzeigen. Denken Sie daran, diese sicher aufzubewahren und Ihr Client-Geheimnis zu aktualisieren, wenn Sie glauben, dass Ihre Anmeldeinformationen kompromittiert wurden.

Authentifizierung

Spotify verwendet OAuth 2.0 für seine WebAPI, was bedeutet, dass Sie zwischen vier Berechtigungsarten wählen können.

• Autorisierungscode
• Autorisierungscode mit PKCE-Erweiterung
• Client-Anmeldeinformationen
• Implizite Gewährung

Hier ist ihr Vollständige Anleitung zur Autorisierung lesen.

In meiner Integration habe ich beides verwendet Client-Anmeldeinformationen und der Autorisierungscode Flow. Client-Anmeldeinformationen können zur Interaktion mit vielen Endpunkten von Spotify verwendet werden, z. B. zur Suche nach Künstlern und Titeln, aber nicht zur Interaktion mit Benutzerdaten. Dafür kann nur der Benutzer Zugriff auf sein Konto gewähren, und dafür habe ich den Autorisierungscode-Flow verwendet.

Client-Anmeldeinformationen

Um Client Credentials zur Authentifizierung Ihrer Anfragen an die Spotify Web API zu verwenden, rufen Sie einfach Ihre Client-ID und Ihr Client Secret von der App-Einstellungsseite im Spotify-Portal ab, wie oben gezeigt. Sie müssen auf Client-Geheimnis anzeigen um das Geheimnis anzuzeigen.

Bewahren Sie diese an einem sicheren Ort auf. Ich habe meine aufbewahrt als Konstante in meinem Mendix App

Als nächstes müssen wir einen POST REST-Aufruf wie folgt durchführen:

Location :https://accounts.spotify.com/api/token
HTTP Method :POST
HTTP Header : Content-Type 'application/x-www-form-urlencoded'

Body :
grant_type=client_credentials&client_id=XXX_Your_Client)ID_XXX&client_secret=XXX_Your_Client_Secret_XXX

Ich habe Import Mapping angewendet, das die folgende JSON-Struktur verwendet, um das Token einer Entität in meinem Mendix App:

{
"access_token": "XXX_Your_Valid_Token_Response_XXX",
"token_type": "Bearer",
"expires_in": 3600
}

Die Token sind 3600 Sekunden (eine Stunde) gültig und müssen nach Ablauf ihrer Gültigkeit erneuert werden.

Suche in Spotify

Sobald Sie ein Token erhalten haben, ist es sehr einfach zu verwenden. Um eine Suche auszuführen, müssen wir eine Anfrage an Spotifys Such-API stellen. Schauen Sie sich die vollständige Dokumentseite wenn Sie mehr lesen möchten.

Wir verwenden den Endpunkt wie in den Dokumenten beschrieben mit einer zusätzlichen Abfragezeichenfolge zur Übergabe unserer Parameter:

Die endgültige Anfrage sieht folgendermaßen aus:

Location :https://api.spotify.com/v1/search?q=URL_Encoded_Query_String&type=album,artist,track
HTTP Method :GET
HTTP Header : Authorization 'Bearer '+$SpotifyToken/Access_token

Beachten Sie die Abfragezeichenfolge, die durch das „?“ in der URL angezeigt wird. Dies kann jede beliebige Zeichenfolgenvariable sein, solange sie URL-codiert ist. Und „Typ“ ist die Art der auszuführenden Suche, in diesem Fall für Alben, Interpreten und Titel.

Die vollständige JSON-Antwort ist ziemlich lang, daher werde ich sie hier nicht einfügen, aber Sie können Lesen Sie die Dokumentation für weitere Informationen.

Zum Schluss habe ich diese Antwort mit ihrer eigenen Importzuordnung und JSON-Struktur zugeordnet (wobei ich „Automatisch zuordnen“ ausgewählt habe) und eine einfache Benutzeroberfläche zum Anzeigen der Daten erstellt:

Profi-Tipp – Sie können die Bild Widget um ein Bild von einer URL anzuzeigen. Die Suchantwort enthält Bilder, die auf URLs für den Titel, den Künstler und das Album gehostet werden.

Als nächstes in dieser Reihe …

Das war es fürs Erste. Im zweiten Teilerkläre ich, wie Sie sich mithilfe des Autorisierungscode-Flows authentifizieren und den erhaltenen persönlichen Zugriffstoken verwenden, um die Wiedergabe von Songs auf jedem mit Spotify verbundenen Gerät zu starten und zu stoppen.