I have a modern UI web part in SharePoint Online. This component needs to invoke a custom REST API that will be hosted in an Azure web app (not SharePoint REST API). I may also call this API directly from JavaScript in SharePoint online pages. This will be deployed for different customers having separate SP Online tenancies.

I need to ensure that the API is called from SharePoint Online sites only and want to verify the Site URL and logged in user. That is, it should not be possible for someone to call this API directly. I do not need any specific authorization, just authentication of the SharePoint Online user and a way to verify that Site URL parameter sent in REST API parameters matches with the site of the page from where API is invoked.

Please point me in the direction to get this implemented.

1 Answer 1

  • In order to protect your Azure hosted web API you can register an app for single tenant and protect your web api through azure ad.
  • Alternative to this is you can use Authentication tab from azure web app to protect it. refer the below screen.


  • then Click on Add Identity provider and select Microsoft as you want only login user can access your web API.

Add Identity Provider

  • After click on it select Microsoft as Identity provider.

  • You will get below screen enter image description here

  • Above are the step to protect your web api.

  • Use below code to call it in your modern web part or SPFx web part.

import { AadHttpClient, HttpClientResponse } from '@microsoft/sp-http';

export default class HelloWorldWebPart extends BaseClientSideWebPart<IHelloWorldWebPartProps> {
  public render(): void {
    // ...

      .then((client: AadHttpClient): void => {
          .get('https://contoso.azurewebsites.net/api/orders', AadHttpClient.configurations.v1)
          .then((response: HttpClientResponse): Promise<Order[]> => {
            return response.json();
          .then((orders: Order[]): void => {
            // process data

  // ...

Connect to Azure AD applications using the AadHttpClient

  • Thanks. I guess I should use multi-tenant option as API will be called from many different SPO tenancies. My main requirement is to call this API from JavaScript code that we have in .aspx pages we deployed in SPO sites. How to call protected API directly from JavaScript while using the authentication of user logged-in to SharePoint?
    – Prakash
    Nov 26, 2022 at 6:14
  • in that case you will require to configure single page appliaction app call it using MSAL Nov 27, 2022 at 8:37
  • Please share any link with sample for this. Thank you.
    – Prakash
    Nov 28, 2022 at 7:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.