Data from Microsoft Entra to Web Page

Question

Hello,

I created an application on Microsoft Entra and granted it the necessary permissions. I would like to display users on a web page with their first name, last name, email addresses, etc.

Capture d’écran de la table Autorisations configurées après l’octroi du consentement administrateur

I have all the access of the application (access token, tenant id...) User's image

I'd like to have a display like this (like the contacts in Sharepoint) on my Web Page if it's possible.

User's image

Could you please tell me how I can do that?

Thank you

Accepted Answer

Hi @MOUSSAOUI Mohammed , have you used the Graph API? It's a good way to accomplish this. You can follow the linked document for detailed instructions, but the following is a sample code snippet:


// Initialize the MSAL library
const msalConfig = {
  auth: {
    clientId: 'YOUR_CLIENT_ID',
    authority: 'https://login.microsoftonline.com/YOUR_TENANT_ID',
    redirectUri: 'http://localhost:3000'
  }
};
const msalInstance = new msal.PublicClientApplication(msalConfig);

// Authenticate the user and obtain an access token
const loginRequest = {
  scopes: ['User.Read.All']
};
msalInstance.loginPopup(loginRequest).then(response => {
  const accessToken = response.accessToken;

  // Call the Microsoft Graph API to retrieve a list of users
  const usersEndpoint = 'https://graph.microsoft.com/v1.0/users';
  const usersRequest = new Request(usersEndpoint, {
    headers: new Headers({
      'Authorization': `Bearer ${accessToken}`
    })
  });
  fetch(usersRequest).then(response => {
    return response.json();
  }).then(data => {
    // Parse the JSON response and display the user data on your web page
    const users = data.value;
    users.forEach(user => {
      const firstName = user.givenName;
      const lastName = user.surname;
      const email = user.mail;
      // Display the user data on your web page using HTML and JavaScript
    });

Please let me know if you have any questions and I can help you further.

If this answer helps you please mark "Accept Answer" so other users can reference it.

Thank you,

James

Share via

Data from Microsoft Entra to Web Page

0 additional answers

Your answer