Get My Followed Sites in SharePoint Online

In SharePoint 2013 new social features are incorporated, one of those is the following. We can follow Users / Peoples, Documents, Sites and Tags. This is a very good reference.

Scenario

We have our portal site collection and my site collection in Office 365 sites. We have a requirement to show only sites that are followed by the current user (the user who is currently logged into the site) on the portal site collection.

On my site collection this WebPart is already available as in the following screenshot:


Figure 1: OOB XSLTViewer web part on MySite: Sites I'm following

On my site collection this is XSLTViewer web part is used for the Social list. For more details see how it is configured.

But we don't have the availability of the Social list on the portal site collection, so we can't use the web part that is on My site collection.

Approach: We decided to use the rest service for getting the current user followed sites as /_api/social.following/my/followed%28types=4%29
More details on Social feed REST API reference for SharePoint 2013. Here type is 4 that is for sites. %28 for "(" and 29 for ")". If you want to directly run into browser try like this:

<Site Collection>/_api/social.following/my/followed(types=4)

We have written one JavaScript file, called the preceding rest service and just appended in Div tag. We have uploaded the JavaScript file in “Master Page Gallery”.

We have added a content editor web part on the page and you can refer to the JavaScript link as:


Figure 2: Referring to JavaScript in Content Editor web part

Code snippet: (please bear with the UI and HTML formatting). I am also attaching the complete JavaScript file in code.

//function : calls rest service
function getMyFollowedSites()
{
var restUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/social.following/my/followed%28types=4%29"; //Type 4 for sites

    var executor = new SP.RequestExecutor(_spPageContextInfo.webAbsoluteUrl);
    executor.executeAsync(
    {
        url: restUrl,
        method: "GET",
        headers: { "Accept": "application/json; odata=verbose" },
        success: successHandler,
        error: failureHandler
    });
}

//success callback
function successHandler(data)
{
  var jsonObject = JSON.parse(data.body);
  var results = jsonObject.d.Followed.results;
  var htmlString = '';

    // preparing the HTML for the result
    for (resultCount=0;resultCount<results.length;resultCount++)
    {
        //Preparing the HTML
    htmlString += "<a id=\"aid"+resultCount+"\"title=\""+results[resultCount].Name+"\" href=\""+results[resultCount].Uri+"\">"+results[resultCount].Name+"</a>      ";

                    htmlString += results[resultCount].Uri;
                    htmlString += "<br/>";
    }
    htmlString +="</div>";

    htmlResultDiv = document.getElementById('htmlResult');
    htmlResultDiv.innerHTML=htmlString;
}

 // Failure callback
function failureHandler(data, errorCode, errorMessage)
{
   alert('Error Code: ' + errorCode);
   alert('Error Message: ' + errorMessage);
}

HTML

<div>
   <div id="htmlResult" style="float:left;"></div>
</div>

Thanks!

Enjoy reading.

Feel free to comment/suggest/feedback.