Spotify를 통합하는 방법 Mendix: 1 부

라이언 모크
2023 년 10 월 3 일
11분 읽기

우리는 조직에 실질적인 비즈니스 가치를 가져다주는 앱을 구축할 수 있는 모든 영향력 있는 방법에 대해 많이 이야기합니다. 하지만 가장 전문적이고 비즈니스를 변화시키는 앱조차도 약간의 재미가 필요합니다. 그래서 오늘은 일상적인 앱에 약간의 음악을 추가하는 데 집중할 것입니다.

저는 끊임없이 음악을 듣습니다. 일할 때, 게임을 할 때, 집안일을 할 때, 또는 다른 일을 할 때에도 음악을 틀어놓습니다.

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의 Search 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 데이터 표시

Protip – 다음을 사용할 수 있습니다. 이미지 위젯 URL에서 이미지를 표시합니다. 검색 응답에는 트랙, 아티스트 및 앨범에 대한 URL에 호스팅된 이미지가 포함됩니다.

이 시리즈의 다음 내용은…

지금은 그게 다입니다. 두 번째 부분에서, 인증 코드 흐름을 사용하여 인증하는 방법과 수신한 개인 액세스 토큰을 사용하여 Spotify에 연결된 모든 장치에서 노래 재생을 시작 및 중지하는 방법에 대해 다룹니다.

Spotify를 통합하는 방법 Mendix: 1부 | Mendix

사이트 검색

개발자 블로그