Kit de ferramentas do Microsoft Graph: Web Components da plataforma Microsoft GraphMicrosoft Graph Toolkit: Web Components powered by Microsoft Graph

O kit de ferramentas do Microsoft Graph é uma coleção de componentes da Web e auxiliares reutilizáveis da estrutura, que podem acessar e trabalhar com o Microsoft Graph.The Microsoft Graph Toolkit is a collection of reusable, framework-agnostic web components and helpers for accessing and working with Microsoft Graph. Os componentes são totalmente funcionais à direita da caixa, com provedores internos que autenticam e buscam dados do Microsoft Graph.The components are fully functional right of out of the box, with built in providers that authenticate with and fetch data from Microsoft Graph.

O Microsoft Graph Toolkit torna fácil usar o Microsoft Graph em seu aplicativo.The Microsoft Graph Toolkit makes it easy to use Microsoft Graph in your application. No exemplo abaixo, Confira como um usuário conectado e seus eventos de calendário são exibidos com apenas duas linhas de código usando os componentes de login e agenda .In the example below, see how a signed in user and their calendar events are displayed with just two lines of code by using the Login and Agenda components.

Abra este exemplo em gerenciamento de. devOpen this example in mgt.dev

O que há no Microsoft Graph Toolkit?What's in the Microsoft Graph Toolkit?

ComponentesComponents

O kit de ferramentas do Microsoft Graph inclui uma coleção de componentes Web para as experiências mais compiladas com as APIs do Microsoft Graph.The Microsoft Graph Toolkit includes a collection of web components for the most commonly built experiences powered by Microsoft Graph APIs.

ComponenteComponent DescriçãoDescription
LogonLogin Um botão e um controle de submenu para autenticar um usuário com a plataforma de identidade da Microsoft e exibir as informações de perfil do usuário em entrar.A button and a flyout control to authenticate a user with the Microsoft Identity platform and display the user's profile information on sign in.
PessoaPerson Exibe uma pessoa ou contato por sua foto, nome e/ou endereço de email.Displays a person or contact by their photo, name, and/or email address.
PessoasPeople Exibe um grupo de pessoas ou contatos por suas fotos ou iniciais.Displays a group of people or contacts by their photos or initials.
AgendaAgenda Exibe eventos no calendário de um usuário ou grupo.Displays events in a user or group's calendar.
TarefasTasks Exibe e permite adicionar, remover, concluir ou editar tarefas do Microsoft Planner ou do Microsoft to-do.Displays and enables adding, removing, completing, or editing of tasks from Microsoft Planner or Microsoft To-Do.
Seletor de pessoasPeople picker Fornece a capacidade de Pesquisar pessoas e renderizar a lista de resultados.Provides the ability to search for people and renders the list of results.
Cartão de pessoaPerson card Um submenu usado no componente Person para exibir mais informações de perfil sobre um usuário.A flyout used on the person component to display more profile information about a user.
GetGet Faça uma consulta GET para qualquer API do Microsoft Graph diretamente no HTML.Make a GET query to any Microsoft Graph API directly in your HTML.
Seletor de canalChannel picker Fornece a capacidade de Pesquisar os canais do Microsoft Teams para selecionar um canal de uma lista de resultados renderizada.Provides the ability to search for Microsoft Teams channels to select a channel from a rendered list of results.

ProvedoresProviders

Os componentes funcionam melhor quando usados com um provedor.The components work best when used with a provider. Os provedores habilitam a autenticação e fornecem a implementação para adquirir os tokens de acesso para chamar as APIs do Microsoft Graph.Providers enable authentication and provide the implementation for acquiring the access tokens for calling the Microsoft Graph APIs.

ProvedoresProviders DescriçãoDescription
MSALMsal Usa MSAL.js para entrar em usuários e adquirir tokens para uso com o Microsoft Graph.Uses MSAL.js to sign in users and acquire tokens to use with Microsoft Graph.
SharePointSharePoint Autentica e fornece acesso do Microsoft Graph aos componentes dentro de Web Parts do SharePoint.Authenticates and provides Microsoft Graph access to components inside of SharePoint web parts.
TeamsTeams Autentica e fornece acesso do Microsoft Graph aos componentes dentro das guias do Microsoft Teams.Authenticates and provides Microsoft Graph access to components inside of Microsoft Teams tabs.
AcionistaProxy Permite o uso da autenticação de backend ao rotear todas as chamadas para o Microsoft Graph por meio do seu back-end.Allows the use of backend authentication by routing all calls to Microsoft Graph through your backend.
PersonalizadosCustom Crie um provedor personalizado para habilitar a autenticação e o acesso ao Microsoft Graph com o código de autenticação existente do seu aplicativo.Create a custom provider to enable authentication and access to Microsoft Graph with your application's existing authentication code.

Por que usar o kit de ferramentas do Microsoft Graph?Why use the Microsoft Graph Toolkit?

O kit de ferramentas do Microsoft Graph disponibiliza a integração de experiências comuns que o Microsoft Graph em seu próprio aplicativo rápido e fácil.The Microsoft Graph Toolkit makes integrating common experiences powered by Microsoft Graph into your own application quick and easy.

Tempo de desenvolvimento reduzidoCut Development Time

O trabalho para se conectar às APIs do Microsoft Graph e renderizar os dados em uma interface do usuário que parece uma experiência de Microsoft365 é feita para você, sem a necessidade de personalização.The work to connect to Microsoft Graph APIs and render the data in a UI that looks and feels like a Microsoft365 experience is done for you, with no customization required.

Funciona em qualquer lugarWorks Everywhere

Todos os componentes são baseados nos padrões da Web e funcionam de forma perfeita com qualquer navegador e Web Framework modernos (reagir, angulares, Vue, etc.).All components are based on web standards and work seamlessly with any modern browser and web framework (React, Angular, Vue, etc.).

Linda, mas flexívelBeautiful but Flexible

Os componentes foram projetados para serem parecidos com as experiências do Microsoft365, mas também podem ser personalizáveis usando as propriedades personalizadas e Templatingde CSS.The components are designed to look and feel like Microsoft365 experiences, but are also customizable using CSS custom properties and templating.

Quem deve usá-lo?Who should use it?

O Microsoft Graph Toolkit é excelente para desenvolvedores de todos os níveis de experiência que procuram desenvolver um aplicativo Web, guia do Microsoft Teams ou Web Part do SharePoint que se conecta e acessa os dados do Microsoft Graph.The Microsoft Graph Toolkit is great for developers of all experience levels looking to develop a web application, Microsoft Teams tab, or SharePoint web part that connects to and accesses data from Microsoft Graph.

Onde posso usá-lo?Where can I use it?

O kit de ferramentas do Microsoft Graph é suportado nos seguintes navegadores.The Microsoft Graph Toolkit is supported in the following browsers.

Borda Internet Explorer 11 Firefox Chrome Safari Opera Samsung Internet
BordaEdge IE 11IE 11 FirefoxFirefox ChromeChrome SafariSafari OperaOpera SamsungSamsung

Próximas etapasNext steps