Spotifyを統合する方法 Mendix: パート1 | Mendix

メインコンテンツへスキップ

Spotifyを統合する方法 Mendix: パート1

私たちは、組織に具体的なビジネス価値をもたらすアプリを構築するための効果的な方法について、たくさん話してきました。しかし、最もプロフェッショナルでビジネスを変えるようなアプリであっても、ちょっとした楽しみが必要です。そこで今日は、日常的に使用するアプリに少し音楽を追加することに焦点を当てます。

私は常に音楽を聴いています。仕事をしているとき、ゲームをしているとき、家事をしているとき、その他ほとんど何をしているときでも音楽を聴いています。

Spotify はこれに最適です。使いやすく、家の中を移動してもデバイス間で音楽をシームレスに転送できます。ただし、曲や再生デバイスを変更するために、使用中のアプリケーションを頻繁に切り替える必要があるため、イライラすることがあります。

私はおそらく自分だけではないだろうし、他の人もこれにイライラするだろうと気づきました。そこで、再利用可能なSpotifyモジュールを作ることにしました。 Mendix、そして今では、作成するあらゆるアプリに Spotify の基本的なコントロールを組み込むことができます。

ビートをあなたの Mendix Spotify対応アプリ

調査を進めていくうちに、これを機能させるにはいくつかの基本的な手順があることに気付きました。

  • Spotifyにアプリを登録する
  • Spotifyで認証する
    • クライアントベースの認証情報
    • 認証コード
  • アーティストのトラックとアルバムを検索する
  • 再生を開始します
  • 利用可能なデバイスを取得する
  • デバイス間で再生を転送

このシリーズのパート 1 では、Spotify にアプリを登録し、クライアント資格情報を使用して認証し、取得したトークンを使用して Spotify でトラック、アーティスト、アルバムを検索する方法について説明します。

アプリの登録

に行きます Spotify 開発者ダッシュボード Spotify アカウントでログインします。

詳しくはこちら アプリを作成する 必要に応じてすべての詳細を入力してください。最も重要なのは、 リダイレクトURLを設定する あなたへ Mendix アプリ (複数の URL がサポートされており、localhost でも問題なく動作します)。リダイレクト URL は、後からいつでも編集、追加、削除できます。

アプリを作成する

Spotify でアプリを表示しているときに、右上隅にある設定をクリックすると、アプリのクライアント ID とシークレットが表示されます。これらを安全に保管し、資格情報が侵害されたと思われる場合はクライアント シークレットを更新してください。

基本情報を入力してください

認証

Spotify は WebAPI に OAuth 2.0 を使用しているため、選択できる付与タイプは XNUMX つあります。

こちらが彼らの 認可の完全ガイド 読む。

私の統合では、両方を使用しました クライアントの資格情報承認コード フロー。クライアント認証情報は、アーティストやトラックの検索など、Spotify の多くのエンドポイントとやり取りするために使用できますが、ユーザー データとやり取りするためには使用できません。そのためには、ユーザーのみが自分のアカウントへのアクセスを許可できるため、認証コード フローを使用しました。

クライアントの資格情報

クライアント認証情報を使用してSpotify Web APIへのリクエストを認証するには、上記のようにSpotifyポータルのアプリ設定ページからクライアントIDとクライアントシークレットを取得するだけです。 クライアントシークレットを表示 秘密を閲覧するには。

これらを安全な場所に保管してください。私は 定数 私の Mendix アプリ

次に、以下のように POST REST 呼び出しを行う必要があります。

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

私はインポートマッピングを適用しました。これは、次のJSON構造を使用してトークンをエンティティにマッピングします。 Mendix アプリケーション:

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

トークンは 3600 秒 (XNUMX 時間) 有効で、有効期間が過ぎると更新する必要があります。

Spotifyを検索

トークンを取得したら、使い方はとても簡単です。検索を実行するには、Spotifyの検索APIにリクエストを送信する必要があります。 完全なドキュメントページ さらに詳しく読みたい場合は、こちらをご覧ください。

エンドポイントを使用します ドキュメントに記載されている通り パラメータを渡すための追加のクエリ文字列:

最終的なリクエストは次のようになります。

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

URL 内の「?」で示されるクエリ文字列に注意してください。これは、URL エンコードされている限り、任意の文字列変数にすることができます。また、「type」は実行する検索の種類で、この場合はアルバム、アーティスト、トラックです。

完全なJSONレスポンスはかなり長いので、ここでは含めませんが、 ドキュメントを読む 詳細については、こちらをご覧ください。

最後に、この応答を独自のインポート マッピングと JSON 構造 (「自動的にマップ」を選択) にマッピングし、データを表示するためのシンプルな UI を構築しました。

UIデータ表示

ヒント – 画像ウィジェット URL から画像を表示します。検索応答には、トラック、アーティスト、アルバムの URL でホストされている画像が含まれます。

このシリーズの次回は…

以上です。 パート2、認証コード フローを使用して認証し、受信した個人アクセス トークンを使用して Spotify に接続されている任意のデバイスで曲の再生を開始および停止する方法について説明します。

言語を選択してください