Share via

SharePoint 2013: Access User Profile Service Data using JSOM

  • Article

In this article, we will learn to manage or access User Profile Service (UPS) Application using JSOM (Javascript Object Model) and create a basic app. Before we start, let's go through basic UPS terminology.

User Profile – holds the information of someone in an organization. Profiles may be viewed in a structured manner. You may view such properties as ccountName, FirstName, LastName, WorkEmail etc. related to a user.

User Profile Service Application – allows the administrators to view or manage profiles, profile synchronization, My Site, Social Tags etc. It can also pull information from Directory Services like Active Directory.

My Site – a personalized site for an individual user to manage their information and store documents, links, etc. Provides rich networking and social features by enabling users to share information about themselves or their activities. My Site is accessible by clicking on User Name on top right corner of SharePoint page.

Manage and Access User Profile Data

Since we are going to work using JSOM, we can perform only 'Read ' operations with the exception of the Profile picture which can be changed.

*Server Side Code allows Read/Write both operations.

Retrieve User Profile Properties using JSOM

Let's create a SharePoint Hosted App to retrieve user information:

  1. Launch Visual Studio 2013 and select "App for SharePoint 2013" from New Project.
  2. After selecting above project type, you are presented with a window to connect to the SharePoint site and select type of app to be deployed (see below screenshot)

Here a SharePoint Online developer site URL is used and we've selected SharePoint Hosted App. Click Finish.

3.)    After the project is created, you will see a set of folders/files added in Solution Explorer by default to the project.

4.)    If you open "Default.aspx" page, you will find some JavaScript libraries already added to the page.

Here we need to add one more library to start working with User Profiles:

<script type="text/javascript" src="/_layouts/15/sp.UserProfiles.js"></script>

5.) Open App.js, there you will find stub code already added to display current user name:

Here we will add below code to extract User Profile Properties for a User and code will look like this.

In this code, a user's Id is hard coded. This is just a short cut for a prototype. Substitute a user Id you know will be on your system.

Hit F5 to execute the code and it will be deployed to SharePoint site provided initially. But you see it will give message "Error: Access Denied. You do not have permission to perform this action or access this resource."

Reason: You have to set app access permissions for User Profile Service. In solution, open AppManifest.XML file and set the permissions using dropdowns as per below screenshot.

A few things to remember:       

1.)    The format of username to be passed will vary based on environment, like:

For SharePoint Online or on-premises forms authentication, it will be –

i:0#.f|membership|user@domain.com

For SharePoint 2013 on-premises Windows authentication, it will be –

i:0#.w|domain\user

For SharePoint 2013 on-premises SAML-based authentication, it will be –

?i:05:t|adfs with roles%7Cuser@domain.com

2.) Set App Access permission in App Manifest file