Msal-React AdquireToken not returning scopes

PauloSubHeaven-4325 0 Reputation points
2024-02-19T13:20:02.7533333+00:00

I'm trying to make an access token request for a user using msal-react with this code:

  import { useMsal } from '@azure/msal-react'

  
  const createRoom = async (userToken, task) => {
    const urlApi =
      'https://graph.microsoft.com/v1.0/me/onlineMeetings/createOrGet'
    const headers = new Headers()
    const bearer = `Bearer ${userToken.accessToken}`

    headers.append('Authorization', bearer)
    headers.append('Content-Type', 'application/json')
    const attendees = task.executors.map(executor => {
      return {
        identity: {
          user: {
            displayName: executor.name,
          },
        },
        role: 'attendee',
      }
    })

    const options = {
      method: 'POST',
      headers: headers,
      body: JSON.stringify({
        startDateTime: moment(task.startDate).format(
          'YYYY-MM-DDTHH:mm:ss-00:00',
        ),
        endDateTime: moment(task.finalDate).format('YYYY-MM-DDTHH:mm:ss-00:00'),
        subject: task.title,
        participants: {
          organizer: {
            identity: {
              user: {
                displayName: userToken.account.name,
              },
            },
          },
          attendees: attendees,
        },
        externalId: task.id,
      }),
    }

    return fetch(urlApi, options)
      .then(response => response.json())
      .catch(error => console.log(error))
  }

  const microsoftOnlineRoom = async task => {
    const request = {
      scopes: ['User.Read', 'OnlineMeetings.Read', 'OnlineMeetings.ReadWrite'],
      account: accounts[0],
    }

    try {
      let userToken = await instance.acquireTokenSilent(request)
      let onlineRoom = await createRoom(userToken, task)
      if (onlineRoom?.chatInfo) {
        return onlineRoom?.chatInfo?.threadId
      } else {
        if (
          onlineRoom?.error &&
          onlineRoom?.error?.code === 'AuthenticationError'
        ) {
          await authMicrosoftModal()
        } else {
          await authCanceledModal()
        }
      }
    } catch (e) {
      try {
        let userToken = await instance.acquireTokenPopup(request)
        let onlineRoom = await createRoom(userToken, task)
        if (onlineRoom?.chatInfo) {
          return onlineRoom?.chatInfo?.threadId
        } else {
          if (
            onlineRoom?.error &&
            onlineRoom?.error?.code === 'AuthenticationError'
          ) {
            await authMicrosoftModal()
          } else {
            await authCanceledModal()
          }
        }
      } catch (e) {
        await authCanceledModal()
        console.log(e)
      }
    }
  }

In Azure AD the permissions are configured and have granted consent from the administrator: User's image

When calling the acquireTokenSilent or acquireTokenPopup function, it is not returning the 'OnlineMeetings.ReadWrite' scope and it fail when trying to create the online room with the response:

{
    "error": {
        "code": "AuthenticationError",
        "message": "Error authenticating with resource",
        "innerError": {
            "date": "2024-02-19T10:52:12",
            "request-id": "48bf3b6d-05ee-4054-b0e8-9ad9170fd15b",
            "client-request-id": "48bf3b6d-05ee-4054-b0e8-9ad9170fd15b"
        }
    }
}
    

What maybe am I doing wrong? Trying to create a an online meeting room using microsoft graph

Microsoft Graph
Microsoft Graph
A Microsoft programmability model that exposes REST APIs and client libraries to access data on Microsoft 365 services.
11,818 questions
Microsoft Teams Development
Microsoft Teams Development
Microsoft Teams: A Microsoft customizable chat-based workspace.Development: The process of researching, productizing, and refining new or existing technologies.
3,196 questions
{count} votes

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.