question

RS-7668 avatar image
0 Votes"
RS-7668 asked emilyhua-msft edited

How to call graph API to read SP list items from SPFx in SP Online?

I'm new to graph api and trying to use graph api to read sp list items from a custom list using the current user's rights (not service account). But i'm getting an error. I have this so far

in the package-solution.json file, I have this in the solution object


 "webApiPermissionRequests": [  
   {  
     "resource": "Microsoft Graph",  
     "scope": "Sites.Read.All"  
   }  
 ]  

In the helloworld.ts file I have this to init the graph api connection


 public async render(): Promise<void> {
 const element: React.ReactElement<IHelloWorldProps> = React.createElement(
   HelloWorld,
   {
     description: this.properties.description,
     client: await this.context.msGraphClientFactory.getClient()
   }
 );

 ReactDom.render(element, this.domElement);
 }

   public onInit(): Promise<void> {
     graph.setup({
       spfxContext: this.context
     });
    
   return super.onInit();
 }

and in the helloworld.tsx file I have this

 let items = await props.client.api('/sites/TestSite/lists(\'MyFeatures\')/items').get();
 console.log(items);

But I see this error in the dev tools console

 Uncaught (in promise) Error: To view the information on this page, ask a global or SharePoint admin in your organization to go to the API management page in the new SharePoint admin center.
     at e.getToken (chunk.aadTokenProvider_none_3888c2e89a4ae65276c0.js:1)
     at sp-webpart-workbench-assembly_en-us_6db5d03d6aef1b7d63505cff87b165b2.js:65

I haven't done anything on the administrative side to create any api registration or approve anything. I was wondering do I need to do that, and if so, is there a tutorial for how to set it up? And is there anything more in the code I need to adjust like add a client id/secret or something?



EDIT

I added the web part to the app catalogue and it told me to approve it from the API management centre. However when I went there, there was nothing listed in pending or approved. And it says there is an error Could not retrieve Global Service Principal ID Error: Error: {}. Researching that I found this https://eschrader.com/2020/06/23/sharepoint-online-bad-service-principal-breaks-sharepoint-admin-api-access-global-service-principal-id-error-resolved/ Do I need to do this?

Also I found the command Enable-SPOTenantServicePrincipal. Do I need to enable this for the SharePoint Online Client Extensibility service principal? Is this needed to be enabled for the SPFx webparts to use graph api?

sharepoint-dev
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

MichaelHan-MSFT avatar image
0 Votes"
MichaelHan-MSFT answered MichaelHan-MSFT commented

Hi @RS-7668 ,

Yes, the command Enable-SPOTenantServicePrincipal is needed to enable developers to use graph api. You could refer to this article(in the end): https://docs.microsoft.com/en-us/sharepoint/dev/spfx/use-aadhttpclient


If an Answer is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

· 4
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Do I need this part?


graph.setup({
spfxContext: this.context
});

0 Votes 0 ·

Hi @RS-7668 ,

You don't need that part. To use graph api in spfx solutions, you could refer to this article: https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis

0 Votes 0 ·

When I go to API management page, I get the error explained in this article
https://eschrader.com/2020/06/23/sharepoint-online-bad-service-principal-breaks-sharepoint-admin-api-access-global-service-principal-id-error-resolved/
however when I check the Azure app registration page, there is no duplicate entries for SharePoint Online Client Extensibility Web Application Principal.

Do you know how to resolve this error?


0 Votes 0 ·
Show more comments