Comment intégrer Spotify dans Mendix: Partie 1 | Mendix

Passer au contenu principal

Comment intégrer Spotify dans Mendix: Partie 1

Nous parlons beaucoup de toutes les façons efficaces de créer des applications qui apportent une valeur commerciale tangible à votre organisation. Mais même l'application la plus professionnelle et la plus révolutionnaire peut avoir besoin d'un peu de fun. Alors aujourd'hui, nous allons nous concentrer sur l'ajout d'un peu de musique à vos applications quotidiennes.

J'écoute constamment de la musique. J'écoute de la musique pendant que je travaille, que je joue à des jeux, que je fais des tâches ménagères ou à peu près n'importe quoi d'autre.

Spotify est un excellent choix pour cela. Il est facile à utiliser et transfère facilement la musique d'un appareil à l'autre lorsque je me déplace dans ma maison. Cependant, je suis parfois frustré de devoir constamment quitter l'application que j'utilise pour changer de chanson ou d'appareil de lecture.

J'ai réalisé que je n'étais probablement pas unique et que cela agaçait probablement d'autres personnes. J'ai donc décidé de créer un module Spotify réutilisable dans Mendix, et maintenant je peux inclure des commandes de base pour Spotify dans n'importe quelle application que je crée.

Apportez des rythmes à votre Mendix applications avec Spotify

En faisant quelques recherches, j'ai réalisé qu'il y avait quelques étapes de base pour que cela fonctionne :

  • Enregistrez l'application avec Spotify
  • Authentifiez-vous avec Spotify
    • Informations d'identification basées sur le client
    • Code d'autorisation
  • Recherche de morceaux et d'albums d'artistes
  • Lancer la lecture
  • Obtenir les appareils disponibles
  • Transférer la lecture entre les appareils

Dans la première partie de cette série, je vous expliquerai comment enregistrer votre application auprès de Spotify, vous authentifier avec les informations d'identification du client et utiliser le jeton obtenu pour rechercher des pistes, des artistes et des albums sur Spotify.

Enregistrement de l'application

Rendez-vous dans la section Tableau de bord du développeur Spotify et connectez-vous avec votre compte Spotify.

Cliquez à nouveau sur Créer une application et remplissez tous les détails demandés. Plus important encore, définissez votre URL de redirection à ta Mendix application (plusieurs URL sont prises en charge et localhost fonctionne bien). Vous pouvez modifier, ajouter et supprimer des URL de redirection ultérieurement, quand vous le souhaitez.

Créer l'application

Lorsque vous consultez votre application sur Spotify, cliquez sur les paramètres dans le coin supérieur droit pour afficher l'ID client et le secret de votre application. N'oubliez pas de les conserver en lieu sûr et d'actualiser votre secret client si vous pensez que vos informations d'identification sont compromises.

Remplissez les informations de base

Authentification

Spotify utilise OAuth 2.0 pour son WebAPI, ce qui signifie qu'il existe quatre types de subventions parmi lesquels choisir.

Voici leur guide complet sur l'autorisation lire.

Dans mon intégration, j'ai utilisé les deux Informations d'identification du client et la Code d'autorisation flux. Les informations d'identification du client peuvent être utilisées pour interagir avec de nombreux points de terminaison de Spotify, comme la recherche d'artistes et de pistes, mais elles ne peuvent pas être utilisées pour interagir avec les données utilisateur. Pour cela, seul l'utilisateur peut accorder l'accès à son compte, et pour cela, j'ai utilisé le flux de code d'autorisation.

Informations d'identification du client

Pour utiliser les informations d'identification du client pour authentifier vos demandes auprès de l'API Web Spotify, obtenez simplement votre identifiant client et votre secret client à partir de la page Paramètres de l'application dans le portail de Spotify, comme indiqué ci-dessus. Vous devez cliquer sur Afficher le secret client pour voir le secret.

Rangez-les dans un endroit sûr et sécurisé, j'ai stocké les miens comme Constants dans mon Mendix App

Ensuite, nous devons effectuer un appel POST REST comme ci-dessous :

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

J'ai appliqué le mappage d'importation, qui utilise la structure JSON suivante pour mapper le jeton à une entité dans mon Mendix App:

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

Les jetons sont valables 3600 secondes (une heure) et devront être actualisés une fois leur durée écoulée.

Recherche sur Spotify

Une fois que vous avez obtenu un token, il est très simple à utiliser. Pour exécuter une recherche, nous devrons faire une requête à l'API de recherche de Spotify. Découvrez le page de documentation complète pour cela si vous voulez en savoir plus.

Nous utiliserons le point de terminaison comme décrit dans les documents avec une chaîne de requête supplémentaire à transmettre dans nos paramètres :

La requête finale ressemble à ceci :

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

Prenez note de la chaîne de requête indiquée par le « ? » dans l'URL. Il peut s'agir de n'importe quelle variable de chaîne à condition qu'elle soit codée en URL. Et « type » est le type de recherche à exécuter, dans ce cas pour les albums, les artistes et les pistes.

La réponse JSON complète est assez longue, je ne l'inclurai donc pas ici, mais vous pouvez lire la documentation pour cela pour plus d'informations.

Enfin, j'ai mappé cette réponse avec son propre mappage d'importation et sa structure JSON (en choisissant « Mapper automatiquement ») et j'ai créé une interface utilisateur simple pour afficher les données :

Affichage des données de l'interface utilisateur

Astuce de pro – Vous pouvez utiliser le Widget Image pour afficher une image à partir d'une URL. La réponse à la recherche contient des images hébergées sur les URL de la piste, de l'artiste et de l'album.

La suite de cette série…

C'est tout pour le moment. Dans la deuxième partie, J'explique comment s'authentifier à l'aide du flux de code d'autorisation et utiliser le jeton d'accès personnel reçu pour démarrer et arrêter la lecture de chansons sur n'importe quel appareil connecté à Spotify.

Choisissez votre langue