Provedor de Electron

Artigo
11/07/2024

O provedor Electron usa o nó MSAL para entrar usuários e adquirir tokens para usar com o Microsoft Graph em um aplicativo Electron.

Para saber mais sobre provedores de autenticação, consulte provedores.

Introdução

Instalar os pacotes

npm install @microsoft/mgt-element @microsoft/mgt-electron-provider

Você precisa inicializar o ElectronProvider no processo do renderizador (front-end) e o ElectronAuthenticator no processo de main (back-end).

Inicializando o ElectronProvider no processo do renderizador (renderer.ts)

O ElectronProvider é responsável por se comunicar com o ElectronAuthenticator (no processo main) para solicitar tokens de acesso e receber informações sobre o estado registrado necessário para que os componentes funcionem.

import {Providers} from '@microsoft/mgt-element';
import {ElectronProvider} from '@microsoft/mgt-electron-provider/dist/Provider';
import '@microsoft/mgt-components';

const baseURL: GraphEndpoint = 'https://graph.microsoft.us'; // change the base URL

// initialize the auth provider globally
Providers.globalProvider = new ElectronProvider(baseUrl=baseURL);

Inicializando o ElectronAuthenticator no processo de main (main.ts)

O ElectronAuthenticator é responsável por configurar as variáveis de configuração para autenticação MSAL, adquirir tokens de acesso e se comunicar com o ElectronProvider. Inicialize o ElectronAuthenticator no processo de main e configure as variáveis de configuração, como a id do cliente.

import { ElectronAuthenticator, MsalElectronConfig } from '@microsoft/mgt-electron-provider/dist/Authenticator';

let config: MsalElectronConfig = {
  clientId: '<your_client_id>',
  authority: '<your_authority_url>', //optional
  mainWindow: mainWindow,
  scopes: ['user.read'], // We recommend pre-consenting all the required scopes on the Microsoft Entra admin center
  baseURL: 'https://graph.microsoft.us' // change this if you want to use a different M365 endpoint
};

ElectronAuthenticator.initialize(config);

Atributo	Descrição
clientId	ID do cliente de cadeia de caracteres (consulte Criando uma ID de aplicativo/cliente). Obrigatório.
escopos	Cadeias de caracteres separadas por vírgulas para escopos que o usuário deve consentir ao entrar. Recomendado.
Autoridade	Cadeia de caracteres de autoridade – padrão é a autoridade comum. Para aplicativos de locatário único, use a ID do locatário ou o nome do locatário. Por exemplo: `https://login.microsoftonline.com/[your-tenant-contoso.com` ou `https://login.microsoftonline.com/[your-tenant-id]`. Opcional.
Mainwindow	Instância do main BrowserWindow que requer autenticação.
cachePlugin	Plug-in de cache que você gostaria de usar para armazenamento persistente de tokens. Consulte Extensões de Autenticação da Microsoft para Nó. Opcional.
url base	O ponto de extremidade do Microsoft Graph a ser usado para chamadas do Microsoft Graph. Pode ser qualquer uma das implantações de nuvem nacionais com suporte. O valor padrão é `https://graph.microsoft.com`.

Nota: Atualmente, o provedor não dá suporte incremental. Como uma prática recomendada, certifique-se de consentir com todos os escopos que os componentes exigem.

Criar uma ID de aplicativo/cliente

Adicionar novo registro de aplicativo no Microsoft Entra ID para obter uma ID do cliente

Para criar um aplicativo no Microsoft Entra ID, adicione um novo registro de aplicativo e configure um nome de aplicativo e um URI de redirecionamento.

Para criar o aplicativo no Microsoft Entra ID:

Vá para o centro de administração do Microsoft Entra.
Expanda o menu > Identidade expanda Aplicativos> selecione Registros de aplicativo> selecione o botão Novo registro.
Insira o nome do aplicativo; por exemplo, My Electron-App.
Para o tipo de tipos de conta com suporte, selecione Contas em qualquer diretório organizacional (Qualquer diretório Microsoft Entra – Multilocatário) e contas pessoais da Microsoft (por exemplo, Skype, Xbox).
No campo URI de redirecionamento , na lista suspensa, selecione Cliente público/nativo (mobile & desktop)e, no campo URL, insira msal://redirect.
Confirme as alterações selecionando o botão Registrar .

Próximas etapas

Confira o tutorial passo a passo para criar um aplicativo de elétrons.
Dê uma olhada em um aplicativo de exemplo do Electron que mostra como usar o provedor de Elétrons.

Compartilhar via