Want to Integrate Spotify into my AEM site. | Community
Skip to main content
Best answer by kautuk_sahni

There is no integration or connector component between these two products. You would have to create a custom AEM service and integrate with Spotify using its Rest API - which it supports. Here are community articles on how to hook a Restful service into AEM. To hook into a third-party service - you write an CQ OSGi bundle that contains operations that can invoke the third party service. In your custom OSGI service -- you can wrap a Java API that knows how to invoke operations of the third-party service. 

 

Option 1 :-

Creating Adobe Experience Manager bundles that invoke third party Restful web services

http://helpx.adobe.com/experience-manager/using/creating-cq-bundles-consume-web.html

http://helpx.adobe.com/experience-manager/using/integrating-livecycle-cq-applications.html

Spotify Web API :- https://developer.spotify.com/web-api/tutorial/

 

Create a OSGI service or Sling Servlets and write a code to send HTTP request GET/POST in it. 

Example Code :-

import org.apache.commons.httpclient.HttpClient;import org.apache.commons.httpclient.methods.PostMethod;
 
String url = "http://www.google.com";InputStream in = null;try {HttpClient client = new HttpClient();PostMethod method = new PostMethod(url);//Add any parameter if u want to send it with Post req.method.addParameter("p", "apple");int statusCode = client.executeMethod(method);if (statusCode != -1) {in = method.getResponseBodyAsStream();}


 

Option 2:-

Spotify can be programmed using JAVAScript [Spotify Widgets].

Link:- https://developer.spotify.com/technologies/widgets/

We can use Java-scripting in AEM, you can achieve the needful with the same.

Link:-  https://helpx.adobe.com/experience-manager/using/custom-carousel-components.html

Link:- https://docs.adobe.com/docs/en/aem/6-0/develop/sightly/use-api-in-javascript.html

 

I hope this would help you. 

 

Thanks and Regards

Kautuk Sahni

5 replies

smacdonald2008
smacdonald2008
Level 10
February 23, 2016

Looks like this product has a Restful API:

https://developer.spotify.com/web-api/endpoint-reference/

So basically, you would create AEM Components that use this Restful API. 

kautuk_sahni
Community Manager
kautuk_sahniCommunity ManagerAccepted solution
Community Manager
February 23, 2016

There is no integration or connector component between these two products. You would have to create a custom AEM service and integrate with Spotify using its Rest API - which it supports. Here are community articles on how to hook a Restful service into AEM. To hook into a third-party service - you write an CQ OSGi bundle that contains operations that can invoke the third party service. In your custom OSGI service -- you can wrap a Java API that knows how to invoke operations of the third-party service. 

 

Option 1 :-

Creating Adobe Experience Manager bundles that invoke third party Restful web services

http://helpx.adobe.com/experience-manager/using/creating-cq-bundles-consume-web.html

http://helpx.adobe.com/experience-manager/using/integrating-livecycle-cq-applications.html

Spotify Web API :- https://developer.spotify.com/web-api/tutorial/

 

Create a OSGI service or Sling Servlets and write a code to send HTTP request GET/POST in it. 

Example Code :-

import org.apache.commons.httpclient.HttpClient;import org.apache.commons.httpclient.methods.PostMethod;
 
String url = "http://www.google.com";InputStream in = null;try {HttpClient client = new HttpClient();PostMethod method = new PostMethod(url);//Add any parameter if u want to send it with Post req.method.addParameter("p", "apple");int statusCode = client.executeMethod(method);if (statusCode != -1) {in = method.getResponseBodyAsStream();}


 

Option 2:-

Spotify can be programmed using JAVAScript [Spotify Widgets].

Link:- https://developer.spotify.com/technologies/widgets/

We can use Java-scripting in AEM, you can achieve the needful with the same.

Link:-  https://helpx.adobe.com/experience-manager/using/custom-carousel-components.html

Link:- https://docs.adobe.com/docs/en/aem/6-0/develop/sightly/use-api-in-javascript.html

 

I hope this would help you. 

 

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
vipintyagi
vipintyagi
June 25, 2018

Spotify is Rest full web API. In Aem, there is two different way to consume.

1 Client site using javascript and handlebar.js

2 consume web service using java

3 Rest controller.

Using client site access token is required to consume the Spotify response. Asses token will expire after 1 hours and to get the response you have to regenerate access token and as well you have to authenticate URI that must be match to request that you have to set on Spotify application.

2. Write a component to consume a service.this will return list.

Service like this

private static final String accessToken = "BQAJYc4vWoizFY5q5r4MyDSGCGOYqyxW61PwJFxztQZjKQWCcFut_zb3BBlLIwPRwk03UD5bNS2BSNw1AjTM4zhGI8dQnhOy6YX_wB6dkb2Rqxg6k-TrxTOzP_z7YErzEYlPa_6IajvOOIzUTxdW0Hmz03zsWpd-CMKvCrVPyrP6PMGMpz-73H3QN4IoWAFh";

    private static final SpotifyApi spotifyApi = new SpotifyApi.Builder() .setAccessToken(accessToken).build();

    private static final GetListOfCurrentUsersPlaylistsRequest getListOfCurrentUsersPlaylistsRequest = spotifyApi.getListOfCurrentUsersPlaylists() .limit(10) .offset(0) .build();

@Override

public List<Spotify> playlist() {

List<Spotify> spotifyContent = getListOfCurrentUsersPlaylists();

        return spotifyContent;

}

public List<Spotify> getListOfCurrentUsersPlaylists() {

        List<Spotify> spotiFyList =  new ArrayList<Spotify>();

        try {

      

            final Paging<PlaylistSimplified> playlistSimplifiedPaging = getListOfCurrentUsersPlaylistsRequest.execute();

            Spotify spotifyObj =  new Spotify();

            PlaylistSimplified[] playlistsimplified = playlistSimplifiedPaging.getItems();

            for(PlaylistSimplified paylist : playlistsimplified) {

                spotifyObj.setId(paylist.getId());

                spotifyObj.setName(paylist.getName());

                String playListName = paylist.getName();

                String playId = paylist.getId();

                Image[] playListImages = paylist.getImages();

                for(Image img : playListImages) {

                    String imgUrl =  "";

                        imgUrl =  img.getUrl();

               

                }

                spotiFyList.add(spotifyObj);

            }

        } catch ( SpotifyWebApiException |IOException e) {

         ;;;;;;;;;;;;;;;;;;

        }

     

        return spotiFyList;

    }

D
DavvidHe
March 20, 2025

I would use Spotify's Embed API or Web Playback SDK to integrate it into my AEM site. The Embed API allows easy iframe-based integration, while the Web Playback SDK provides more control over playback. Depending on my needs, I would choose the best approach for seamless Spotify integration.

 

 

 

 

J
jakedo1
September 15, 2025

Yeah that’s the right direction, since AEM doesn’t have a native Spotify connector you’ll need to rely on the Web API or widgets with custom OSGi bundles. For anyone exploring stable integrations, you can also check here VCA ’s WOOFApps their official employee login system as an example of how enterprise-grade portals manage cross-platform access. It’s a good reference point when thinking about reliability and scalability.

 
 
Terms & ConditionsAccessibility statement

Loading footer...