Sunday, 19 July 2015

How to get my followed sites in SharePoint Online

Hi All,

In SharePoint 2013 new social features are incorporated, one of those is following. We can follow Users / Peoples, Documents, Sites and Tags. This is very good reference https://msdn.microsoft.com/en-us/library/office/jj163280.aspx 

Scenario:

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

On my site collection this webpart is already available as 



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

On my site collection this is XSLTViewer web part used for Social list. For more details like how it is configured please have a look at http://prashamsabadra.blogspot.in/2012/08/small-finding-related-to-social.html

But Social list we don't have available on portal site collection so we cant use the web part which 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 which 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 above rest service and just appended in Div tag. We have uploaded JS file in “Master Page Gallery”. 

We have added content editor web part on the page and refer the JS link as 


Figure 2: Referring JS in Content Editor web part

Few code snippet as (please bear with UI and HTML formatting)

//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/suggestions/feedback :)

No comments: