visão geral do Kit de ferramentas do Microsoft Graph
Kit de ferramentas do Microsoft Graph é uma coleção de componentes e fornecedores de autenticação reutilizáveis e agnósticos de quadro para acessar e trabalhar com o Microsoft Graph. Os componentes são totalmente funcionais de fábrica, com fornecedores integrados que se autenticam com e buscam dados do Microsoft Graph.
O Kit de ferramentas do Microsoft Graph facilita o uso do Microsoft Graph em sua aplicação. No exemplo a seguir, um usuário conectado e seus eventos de calendário são exibidos com apenas duas linhas de código usando os componentes Logon e Agenda .
Por que usar o Microsoft Graph Toolkit?
O Microsoft Graph Toolkit permite integrar rapidamente e facilmente experiências comuns alimentadas pelo Microsoft Graph ao seu próprio aplicativo. O kit de ferramentas:
Reduz o tempo de desenvolvimento. O trabalho para se conectar às APIs do Microsoft Graph e renderizar os dados em uma interface do usuário que parece e parece uma experiência do Microsoft 365 é feito para você, sem necessidade de personalização.
Funciona em todos os lugares. Todos os componentes são baseados em padrões da Web e funcionam perfeitamente com qualquer navegador moderno e estrutura da Web (como React, Angular ou Vue).
É bonito, mas flexível. Os componentes foram projetados para se parecer com experiências do Microsoft 365, mas também são personalizáveis usando propriedades personalizadas do CSS e templating.
Quem deve usá-lo?
O Microsoft Graph Toolkit é ótimo para desenvolvedores de todos os níveis de experiência que desejam desenvolver um aplicativo que se conecta e acessa dados do Microsoft Graph, como um:
- Aplicativo Web
- Guia Microsoft Teams
- Aplicativo Web Progressivo (PWA)
- Aplicativo Electron
- Web Part do SharePoint
O que há no Microsoft Graph Toolkit?
Componentes
O Microsoft Graph Toolkit inclui uma coleção de componentes da Web para as experiências mais comumente criadas alimentadas pelas APIs do Microsoft Graph.
Os componentes também estão disponíveis como componentes React.
| Componente | Descrição |
|---|---|
| Agenda | Exibe eventos no calendário de um usuário ou grupo. |
| Chat (versão prévia) | Exibe uma conversa em grupo 1:1 ou do Microsoft Teams |
| Arquivo | Representa um arquivo ou pasta com um ícone, um nome de arquivo, um autor e muito mais. |
| Lista de arquivos | Exibe uma lista de vários arquivos ou pastas. |
| Get | Permite que você faça uma consulta GET para qualquer microsoft API do Graph diretamente em seu HTML. |
| Logon | Um botão e um controle de sobrevoo para autenticar um usuário com a plataforma Microsoft Identity e exibir as informações de perfil do usuário ao entrar. |
| Novo chat (versão prévia) | Um formulário para criar uma nova conversa em grupo 1:1 ou no Microsoft Teams |
| Pessoas | Exibe um grupo de pessoas ou contatos por suas fotos ou iniciais. |
| Pessoas seletor | Pesquisa para pessoas e renderiza a lista de resultados. |
| Pessoa | Exibe uma pessoa ou contato por sua foto, nome e/ou endereço de email. |
| Cartão pessoal | Um flyout usado no componente de pessoa para exibir mais informações de perfil sobre um usuário. |
| Selecionador | Renderiza um controle suspenso que permite uma seleção de um único recurso de uma matriz de recursos. |
| Tarefas do Planner | Exibe e habilita a adição, remoção, conclusão ou edição de tarefas de Microsoft Planner ou Microsoft To Do. |
| Caixa de pesquisa | Pesquisa que os canais do Microsoft Teams selecionem um canal em uma lista renderizada de resultados. |
| Resultados da pesquisa | Permite fazer uma consulta ao ponto de extremidade de pesquisa do Microsoft Graph diretamente em seu HTML. |
| Seletor de taxonomia | Use o componente do seletor de taxonomia para consultar o microsoft API do Graph for Taxonomy e renderizar um controle suspenso com termos. |
| Seletor do Teams Channel | Pesquisa que os canais do Microsoft Teams selecionem um canal em uma lista renderizada de resultados. |
| To Do | Exibe e habilita a adição, remoção, conclusão ou edição de tarefas do Microsoft To Do. |
Provedores
Os provedores habilitam a autenticação, fornecem a implementação para adquirir tokens de acesso em várias plataformas e expõem um cliente do Microsoft Graph para chamar as APIs do Microsoft Graph. Os componentes funcionam melhor quando usados com um provedor, mas os provedores podem ser usados por conta própria.
| Provedores | Descrição |
|---|---|
| Personalizados | Cria um provedor personalizado para habilitar a autenticação e o acesso ao Microsoft Graph usando o código de autenticação existente do aplicativo. |
| Elétron | Autentica e fornece acesso do Microsoft Graph a componentes dentro de aplicativos Electron. |
| MSAL2 | Usa o msal-browser para entrar usuários e adquirir tokens a serem usados com o Microsoft Graph. |
| Proxy | Permite o uso da autenticação de back-end roteando todas as chamadas para o Microsoft Graph por meio do back-end. |
| SharePoint | Autentica e fornece acesso do Microsoft Graph a componentes dentro de web parts do SharePoint. |
| TeamsFx | Use o provedor TeamsFx dentro de seus aplicativos do Microsoft Teams para fornecer acesso aos componentes do Microsoft Graph Toolkit ao Microsoft Graph. |
Onde posso usá-lo?
Há suporte para o Microsoft Graph Toolkit nos seguintes navegadores:
|
|
|
|
|
|
|---|---|---|---|---|---|
| Borda | Firefox | Chrome | Safari | Opera | Samsung |
Próximas etapas
- Experimente os componentes do playground.
- Introdução ao Microsoft Graph Toolkit.
- Confira o Kit de Ferramentas do Microsoft Graph no GitHub.