Checking user permission in SharePoint Framework (SPFx) webpart

Hi Friends,

Many times we need to show the controls based on the user permission while creating the custom SharePoint Framework (SPFx) webpart. The first thing we look for is the endpoint to retrieve the information from SharePoint.

In this blog I will tell you how this can be achieved without any endpoint as this information is already available in the SharePoint Framework (SPFx) webpart.

So, if you look into the <WebpartName>webpart.ts file , you can find this information in the current page context

this.context.pageContext.web.permissions

Now we get three methods with this

• hasAllPermissions : Checks if the user has all the permissions
• hasAnyPermissions: Checks if the user has any permission from the collection of permissions
• hasPermission: Checks if the user has given permission
• value: Returns the current user permission set

Now talking of the permissions, you'll get a variety of permissions. For this SharePoint has the SPPermission class. For convenience I am mentioning all the permissions in this blog (which were there at the time of writing the post)

/** * Has no permissions on the Web site. Not available through the user interface. */ static readonly emptyMask: SPPermission; /** * View items in lists, documents in document libraries, and view Web discussion comments. */ static readonly viewListItems: SPPermission; /** * Add items to lists, add documents to document libraries, and add Web discussion comments. */ static readonly addListItems: SPPermission; /** * Edit items in lists, edit documents in document libraries, edit Web discussion comments in documents, * and customize web part Pages in document libraries. */ static readonly editListItems: SPPermission; /** * Delete items from a list, documents from a document library, and Web discussion comments in documents. */ static readonly deleteListItems: SPPermission; /** * Approve a minor version of a list item or document. */ static readonly approveItems: SPPermission; /** * View the source of documents with server-side file handlers. */ static readonly openItems: SPPermission; /** * View past versions of a list item or document. */ static readonly viewVersions: SPPermission; /** * Delete past versions of a list item or document. */ static readonly deleteVersions: SPPermission; /** * Discard or check in a document which is checked out to another user. */ static readonly cancelCheckout: SPPermission; /** * Create, change, and delete personal views of lists. */ static readonly managePersonalViews: SPPermission; /** * Create and delete lists, add or remove columns in a list, and add or remove public views of a list. */ static readonly manageLists: SPPermission; /** * View forms, views, and application pages, and enumerate lists. */ static readonly viewFormPages: SPPermission; /** * Allow users to open a Web site, list, or folder to access items inside that container. */ static readonly open: SPPermission; /** * View pages in a Web site. */ static readonly viewPages: SPPermission; /** * View the layouts page? */ static readonly layoutsPage: SPPermission; /** * Add, change, or delete HTML pages or web part Pages, and edit the Web site using a SharePoint * Foundation–compatible editor. */ static readonly addAndCustomizePages: SPPermission; /** * Apply a theme or borders to the entire Web site. */ static readonly applyThemeAndBorder: SPPermission; /** * Apply a style sheet (.css file) to the Web site. */ static readonly applyStyleSheets: SPPermission; /** * View reports on Web site usage. */ static readonly viewUsageData: SPPermission; /** * Create a Web site using Self-Service Site Creation. */ static readonly createSSCSite: SPPermission; /** * Create subsites such as team sites, Meeting Workspace sites, and Document Workspace sites. */ static readonly manageSubwebs: SPPermission; /** * Create a group of users that can be used anywhere within the site collection. */ static readonly createGroups: SPPermission; /** * Create and change permission levels on the Web site and assign permissions to users and groups. */ static readonly managePermissions: SPPermission; /** * Enumerate files and folders in a Web site using Microsoft Office SharePoint Designer 2007 and WebDAV interfaces. */ static readonly browseDirectories: SPPermission; /** * View information about users of the Web site. */ static readonly browserUserInfo: SPPermission; /** * Add or remove personal web parts on a web part Page. */ static readonly addDelPrivateWebParts: SPPermission; /** * Update web parts to display personalized information. */ static readonly updatePersonalWebParts: SPPermission; /** * Grant the ability to perform all administration tasks for the Web site as well as manage content. * * @remarks * Activate, deactivate, or edit properties of Web site scoped Features through the object model or * through the user interface (UI). When granted on the root Web site of a site collection, activate, * deactivate, or edit properties of site collection scoped Features through the object model. To * browse to the Site Collection Features page and activate or deactivate site collection scoped * Features through the UI, you must be a site collection administrator. */ static readonly manageWeb: SPPermission; /** * Use features that launch client applications; otherwise, users must work on documents locally and upload changes. */ static readonly useClientIntegration: SPPermission; /** * Use SOAP, WebDAV, or Microsoft Office SharePoint Designer 2007 interfaces to access the Web site. */ static readonly useRemoteAPIs: SPPermission; /** * Manage alerts for all users of the Web site. */ static readonly manageAlerts: SPPermission; /** * Create e-mail alerts. */ static readonly createAlerts: SPPermission; /** * Allows a user to change his or her user information, such as adding a picture. */ static readonly editMyUserInfo: SPPermission; /** * Enumerate permissions on the Web site, list, folder, document, or list item. */ static readonly enumeratePermissions: SPPermission; /** * Has all permissions on the Web site. Not available through the user interface. */ static readonly fullMask: SPPermission;

Hope this article will help you in integrating the user permission based logic in your SharePoint Framework (SPFx) webpart.

Happy Coding
Sumit Kanchan
#SharePointFramework #SharePointWidgets