Tutorial: Chamar a API do Microsoft Graph a partir de um aplicativo Web Node/Express.js
Aplica-se a: Inquilinos do Workforce
Inquilinos externos (saber mais)
Neste tutorial, você chama a API do Microsoft Graph de um aplicativo Web Node/Express.js. Depois que um usuário entra, o aplicativo adquire um token de acesso para chamar a API do Microsoft Graph.
Este tutorial é a parte 3 da série de tutoriais de 3 partes.
Neste tutorial, você:
- Atualizar o aplicativo Web Node/Express.js para adquirir um token de acesso
- Use o token de acesso para chamar a API do Microsoft Graph.
Pré-requisitos
- Conclua as etapas em Tutorial: Adicionar entrada a uma aplicação web Node/Express.js usando a Microsoft Identity Platform.
Adicionar componentes da interface do usuário
No editor de códigos, abra arquivo de views/index.hbs e adicione um link Exibir perfil de usuário usando o seguinte trecho de código:
<a href="/users/profile">View user profile</a>
Depois de fazer a atualização, seu arquivo views/index.hbs deve ser semelhante ao seguinte arquivo:
<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}}
Crie o ficheiro views/profile.hbs e, em seguida, adicione o seguinte código:
<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>
- Esta página exibe os detalhes do perfil do usuário que a API do Microsoft Graph retorna.
Adquira um token de acesso
No editor de códigos, abra o arquivo auth/AuthProvider.js e adicione o método getToken
na classe AuthProvider
.
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);
}
};
}
}
//...
O método getToken
usa o escopo especificado para adquirir um token de acesso
Adicionar rota de API de chamada
No editor de códigos, abra o arquivo routes/users.js e adicione a seguinte rota:
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,
});
},
);
Você aciona a rota
/profile
quando o usuário cliente seleciona o link Ver perfil do usuário. A aplicação:- Adquire um token de acesso com a permissão User.Read.
- Faz uma chamada para a API do Microsoft Graph para ler o perfil do usuário conectado.
- Exibe os detalhes do usuário no profile.hbs UI.
Chame a API do Microsoft Graph
Crie fetch.js ficheiro e, em seguida, adicione o seguinte código:
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 };
A chamada de API real acontece no arquivo fetch.js.
Executar e testar o aplicativo Web Node/Express.js
- Siga os passos em Executar e testar a aplicação web Node/Express.js para executar a sua aplicação web.
- Depois de entrar, selecione Exibir perfil de usuário link. Se o seu aplicativo funcionar corretamente, você verá o perfil do usuário conectado como lido na API do Microsoft Graph.