Use Microsoft Graph Permission in SPFx solution without deploying 😌

The Microsoft Graph API is a very powerful and rich REST endpoint and is used in many custom solution. I myself use the Graph API in a lot of my custom client SPFx based solutions, too - of cource 😊 The only annoying step is to enable the API permission(s) for the SPFx solution. Before you can use the API you need to register the APP and approve the requested permissions in Office 365.

This means you have to do the following steps:

  • Define the required API permissions and add insert the permissions in the package-solution.json
  • gulp bundle and gulp package-solution to create an deployment package
  • Install the package in the App-Catalog
  • Go to the SharePoint Admin Center Web API Permissions page
  • Review and approve the requested permissions

All these steps are necessary before you can make the first call to the Microsoft Graph API from your SPFx solution.

Skip the (first) deployment step

♨️ ONLY for developing purpose it is possible to skip the initial deployment steps. To do so we have to add the permission manually to the SharePoint Online Client Extensibility Web Application Principal. You find this Azure Active Directory Application in the Azure Portal:

  • Open the Microsoft Entra Admiun Center from your Office 365 tenant
  • Expand the group "Applications"
  • Open the blade "App-Registration"
  • Select "All Applications" to display all entries

The SharePoint Online Client Extensibility Web Application Principal is responsible to hold the connection to the API from SharePoint (e. g. SPFx or other custom development) using the implicit flow. Click on the entry to open the detail page. On the detail page choose the link "API permissions". With the button "Add permission" it is possible to add new permission to the App (see below image).

Add permissions

Once you have added new permissions click on the button "Grant admin consent for [YOUR TENANT]." To verify that the new permissions are applied you can switch to the "API access page" (https://[YOUR TENANT] If everything correct here you can use the permission in your client solution.

Keep in mind: this option is only valid for developing purpose. For production add the necessary permission to the package-solution.json and use the standard request for app permissions!


Beliebte Posts aus diesem Blog

Exchange Online: Schutzregel fĂŒr E-Mail Weiterleitung

Vertikaler Bereich deaktiviert

Power Automate: Abrufen von SharePoint Listenelementen mit ODATA-Filter