Öğretici: Node/Express.js web uygulamasından Microsoft Graph API'sini çağırma

Şunlar için geçerlidir: İş gücü kiracıları Dış kiracılar (daha fazla bilgi edinin)

Bu öğreticide, Node/Express.js web uygulamasından Microsoft Graph API'sini çağıracaksınız. Kullanıcı oturum açtığında, uygulama Microsoft Graph API'sini çağırmak için bir erişim belirteci alır.

Bu öğretici, 3 bölümden oluşan öğretici serisinin 3. bölümüdür.

Bu öğreticide şunları yapacaksınız:

• Erişim belirteci almak için Node/Express.js web uygulamasını güncelleştirme
• Microsoft Graph API'sini çağırmak için erişim belirtecini kullanın.

Önkoşullar

• Eğitimi: Microsoft kimlik platformukullanarak Node/Express.js web uygulamasına oturum açma özelliği ekleme makalesindeki adımları tamamlayın.

Kullanıcı arabirimi bileşenleri ekleme

1. Kod düzenleyicinizde views/index.hbs dosyasını açın, ardından aşağıdaki kod parçacığını kullanarak Kullanıcı profilini görüntüle bağlantısını ekleyin:

   <a href="/users/profile">View user profile</a>
   

   Güncelleştirmeyi yaptıktan sonra, views/index.hbs dosyanız aşağıdaki dosyaya benzer görünmelidir:

      <h1>{{title}}</h1>
       {{#if isAuthenticated }}
       <p>Hi {{username}}!</p>
       <a href="/users/id">View ID token claims</a>
       <br>
       <a href="/users/profile">View user profile</a>
       <br>
       <br>
       <a href="/auth/signout">Sign out</a>
       {{else}}
       <p>Welcome to {{title}}</p>
       <a href="/auth/signin">Sign in</a>
       {{/if}}
   

2. views/profile.hbs dosyası oluşturun ve aşağıdaki kodu ekleyin:

   <h1>Microsoft Graph API</h1>
   <h3>/me endpoint response</h3>
   <table>
       <tbody>
           {{#each profile}}
           <tr>
               <td>{{@key}}</td>
               <td>{{this}}</td>
           </tr>
           {{/each}}
       </tbody>
   </table>
   <br>
   <a href="/">Go back</a>
   

   • Bu sayfada, Microsoft Graph API'sinin döndürdüğü kullanıcının profil ayrıntıları görüntülenir.

Erişim belirteci alma

Kod düzenleyicinizde auth/AuthProvider.js dosyasını açın ve getToken sınıfına AuthProvider yöntemi ekleyin:

class AuthProvider {
    //...
        getToken(scopes, redirectUri = "http://localhost:3000/") {
            return  async function (req, res, next) {
                const msalInstance = authProvider.getMsalInstance(authProvider.config.msalConfig);
                try {
                    msalInstance.getTokenCache().deserialize(req.session.tokenCache);
    
                    const silentRequest = {
                        account: req.session.account,
                        scopes: scopes,
                    };
                    const tokenResponse = await msalInstance.acquireTokenSilent(silentRequest);
    
                    req.session.tokenCache = msalInstance.getTokenCache().serialize();
                    req.session.accessToken = tokenResponse.accessToken;
                    next();
                } catch (error) {
                    if (error instanceof msal.InteractionRequiredAuthError) {
                        req.session.csrfToken = authProvider.cryptoProvider.createNewGuid();
    
                        const state = authProvider.cryptoProvider.base64Encode(
                            JSON.stringify({
                                redirectTo: redirectUri,
                                csrfToken: req.session.csrfToken,
                            })
                        );
                        
                        const authCodeUrlRequestParams = {
                            state: state,
                            scopes: scopes,
                        };
    
                        const authCodeRequestParams = {
                            state: state,
                            scopes: scopes,
                        };
    
                        authProvider.redirectToAuthCodeUrl(
                            req,
                            res,
                            next,
                            authCodeUrlRequestParams,
                            authCodeRequestParams,
                            msalInstance
                        );
                    }
    
                    next(error);
                }
            };
        }
}
    //...

getToken yöntemi, erişim belirteci almak için belirtilen kapsamı kullanır

API çağrısı yolunu ekle

Kod düzenleyicinizde routes/users.js dosyasını açın ve aşağıdaki yolu ekleyin:

router.get(
    "/profile",
    isAuthenticated,
    authProvider.getToken(["User.Read"]), // check if user is authenticated
    async function (req, res, next) {
    const graphResponse = await fetch(
        GRAPH_ME_ENDPOINT,
        req.session.accessToken,
    );
    if (!graphResponse.id) {
        return res 
        .status(501) 
        .send("Failed to fetch profile details"); 
    }
    res.render("profile", {
        profile: graphResponse,
    });
    },
);

• Müşteri kullanıcı /profile bağlantısını seçtiğinde yolunu tetiklersiniz. Uygulama:

  • User.Read izniyle bir erişim belirteci alır.
  • Oturum açmış kullanıcının profilini okumak için Microsoft Graph API'sine çağrı yapar.
  • kullanıcı ayrıntılarını profile.hbs kullanıcı arabiriminde görüntüler.

Microsoft Graph API'sini çağırma

fetch.js dosyası oluşturun ve aşağıdaki kodu ekleyin:

var axios = require('axios');
var authProvider = require("./auth/AuthProvider");

/**
 * Makes an Authorization "Bearer" request with the given accessToken to the given endpoint.
 * @param endpoint
 * @param accessToken
 * @param method
 */
const fetch = async (endpoint, accessToken, method = "GET", data = null) => {
    const options = {
        headers: {
            Authorization: `Bearer ${accessToken}`,
        },
    };

    console.log(`request made to ${endpoint} at: ` + new Date().toString());

    try{
        const response = await axios.get(endpoint, options);
        return await response.data;

    }catch(error){
        throw new Error(error);
    }

};

module.exports = { fetch };

Gerçek API çağrısı fetch.js dosyasında gerçekleşir.

Node/Express.js web uygulamasını çalıştırma ve test edin

1. Web uygulamanızı çalıştırmak için Node/Express.js web uygulaması çalıştırma ve test etme adımlarını kullanın.
2. Oturum açtığınızda Kullanıcı profilini görüntüle bağlantısını seçin. Uygulamanız düzgün çalışıyorsa oturum açmış kullanıcının profilini Microsoft Graph API'sinden okundu olarak görmeniz gerekir.

İlgili içerik

• Node.js web uygulamasında müşteri kullanıcı profilini düzenleme