Criar a API REST para lidar com operações de leitura e exibição com o SharePoint Embedded

Os aplicativos incorporados do SharePoint, como a maioria dos aplicativos que interagem com sistemas de armazenamento back-end e bancos de dados, executam dois tipos de operações: leitura/recuperação de dados e arquivos e armazenamento ou exclusão de arquivos. Nesta seção, você aprenderá como acessar Contêineres Incorporados do SharePoint usando as APIs REST do Microsoft Graph.

Visão geral do nosso aplicativo personalizado e como ele funciona com o SharePoint Embedded, o SharePoint Online e o Microsoft Graph

Os exercícios a seguir neste módulo orientarão você pelas etapas de criação de um aplicativo Web e um serviço Web pode gerenciar contêineres incorporados do SharePoint e executar operações CRUD com documentos nesses contêineres.

Vejamos os dois componentes do aplicativo que você criará e pelo que cada um é responsável.

Aplicativo Web que implementa a experiência do usuário

A interface do usuário é implementada usando o React para criar um aplicativo de página única (SPA). Este aplicativo pode usar o Microsoft Graph para ler e gravar conteúdo e documentos nos Contêineres porque essas são operações que podem ser executadas usando as permissões app+user ou delegadas.

O aplicativo Web usará a IU do Fluent, React Controls (v9) e o Microsoft Graph Toolkit (v3) para usar diferentes componentes de interface do usuário para simplificar a criação da experiência do usuário.

Nem todas as operações podem ser executadas pelo aplicativo React do lado do cliente porque exigem permissões elevadas que só podem ser tratadas no lado do servidor.

API do lado do servidor que lida com operações com privilégios mais altos

Nem todas as operações de contêiner podem ser executadas diretamente pelo aplicativo React. Para esses cenários, incluindo a criação, exclusão e obtenção de uma lista de Contêineres Incorporados do SharePoint, criaremos um servidor de API do lado do servidor

Para esse projeto, você pode usar um aplicativo do Azure Functions ou usar um aplicativo Web do Azure para hospedar um projeto de ASP.NET Web API. Em nosso projeto, usaremos o servidor leve Node.js Restify .

Essa API receberá solicitações do nosso React SPA que incluem o token de acesso do usuário que ele recebeu quando entrou no aplicativo. Você usará esse token de acesso e o fluxo OBO para obter um token de acesso destinado ao Microsoft Graph que você pode usar para executar operações de contêiner como usuário.

Criando contêineres incorporados do SharePoint com o Microsoft Graph

A API do lado do servidor precisará criar contêineres, entre outras tarefas. Isso será feito pela API do lado do servidor usando o fluxo Em Nome de para obter um token de acesso destinado ao Microsoft Graph.

Essa chamada é iniciada pela primeira vez pelo nosso SPA do React que incluirá o token de acesso do usuário conectado no momento.

O servidor de API criará primeiro uma instância de um ConfidentialClientApplication usando a MSAL (Biblioteca de Autenticação da Microsoft). Para criar oConfidentialClientApplication, você se autenticará no Microsoft Entra ID usando a ID do cliente e o segredo do cliente do nosso aplicativo:

const msalConfig: MSAL.Configuration = {
  auth: {
    clientId: process.env['API_ENTRA_APP_CLIENT_ID']!,
    authority: process.env['API_ENTRA_APP_AUTHORITY']!,
    clientSecret: process.env['API_ENTRA_APP_CLIENT_SECRET']!
  }
};

const confidentialClient = new MSAL.ConfidentialClientApplication(msalConfig);

Em seguida, use o ConfidentialClientApplication para obter um token de acesso em nome do usuário atual, trocando o token de acesso fornecido da entrada do usuário por um token de acesso que pode chamar o Microsoft Graph:

// get user's access token from the request submitted by the React SPA
const [bearer, token] = req.headers.authorization.split(' ');

// set that token to the assertion and the scopes to the permissions we
//    need in the access token to call Microsoft Graph
const graphTokenRequest = {
  oboAssertion: token,
  scopes: [
    Scopes.GRAPH_SITES_READ_ALL,
    Scopes.SPREPOSERVICES_FILESTORAGECONTAINER_SELECTED
  ]
};

// obtain the OBO token using the ConfidentialClientApplication object
const ccaOboResponse = await confidentialClient.acquireTokenOnBehalfOf(graphTokenRequest);
const oboGraphToken = ccaOboResponse!.accessToken;

Agora que você tem o token OBO para o Microsoft Graph, crie um provedor de autenticação e, em seguida, uma instância do cliente do Microsoft Graph para simplificar as chamadas para a API REST do Microsoft Graph:

const authProvider = (callback: MSGraph.AuthProviderCallback) => {
  callback(null, graphTokenRequest);
};

const graphClient = MSGraph.Client.init({
  authProvider: authProvider,
  defaultVersion: 'beta'
});

Por fim, envie uma solicitação HTTP POST ao ponto de extremidade do https://graph.microsoft.com/{version}/storage/fileStorage/containers Microsoft Graph para criar um novo contêiner:

const containerRequestData = {
  displayName: 'New container name',
  description: 'New container description',
  containerTypeId: process.env["CONTAINER_TYPE_ID"]
};

const graphResponse = await graphClient.api(`storage/fileStorage/containers`)
                                       .post(containerRequestData);

Obtendo uma lista de Contêineres Incorporados do SharePoint com o Microsoft Graph

A outra tarefa comum que você executará é obter uma lista de todos os contêineres. Esta solicitação tem os mesmos requisitos que a criação de um Contêiner.

A autenticação e a inicialização de um cliente do Microsoft Graph são idênticas às da criação de um contêiner. A única diferença é a solicitação que você envia para o Microsoft Graph. Neste caso. você emitirá um HTTP GET para o mesmo https://graph.microsoft.com/{version}/storage/fileStorage/containers ponto de extremidade:

const graphResponse = await graphClient.api(`storage/fileStorage/containers?$filter=containerTypeId eq ${process.env["CONTAINER_TYPE_ID"]}`).get();

Resumo

Nesta seção, você aprendeu como acessar Contêineres do SharePoint Embedded usando as APIs REST do Microsoft Graph.