Preparar seu ambiente de desenvolvimento

Vamos começar a desenvolver extensões com o SDK do Windows Admin Center! Neste documento, abordaremos o processo para colocar seu ambiente em funcionamento a fim de criar e testar uma extensão para o Windows Admin Center.

Note

Novo no SDK do Windows Admin Center? Saiba mais sobre As extensões do Windows Admin Center

Dica

Crie uma pasta para armazenar todos os seus arquivos de desenvolvimento da extensão Windows Admin Center para reduzir a execução de comandos.

Para preparar seu ambiente de desenvolvimento, execute as seguintes etapas:

Instalar os pré-requisitos

Para começar a desenvolver com o SDK, baixe e instale os seguintes pré-requisitos:

• Windows Admin Center (GA ou versão prévia)
• Visual Studio ou Visual Studio Code
• Node.js versão 24.18.1 (baixe e instale a versão LTS)
• Gerenciador de pacote de nó (6.14.5 ou posterior)
• NuGet (para extensões de publicação)
• Git para Windows (inclui OpenSSL para gerar certificados autoassinados)

Para ignorar a validação de assinatura que ocorre durante a instalação da extensão nas versões do Windows Admin Center em execução com o .NET 8, você também deve alternar o modo de operação do Windows Admin Center para "Desenvolvimento". Para configurar o modo de desenvolvimento, você deve:

• Abra o arquivo de appsettings.json da instância do Windows Admin Center. Isso pode ser encontrado por padrão em C:\Program Files\WindowsAdminCenter\service\appsettings.json.
• Modifique o campo OperationMode na seção WindowsAdminCenter/System para ler "Desenvolvimento" em vez de "Produção".

Instalar dependências globais

Em seguida, instale ou atualize as dependências necessárias para seus projetos usando o Node Gerenciador de Pacotes. Instale essas dependências globalmente para que todos os projetos possam acessá-las.

npm install -g @angular/cli@20.3.25

npm install -g gulp
npm install -g typescript
npm install -g eslint
npm install -g @microsoft/windows-admin-center-sdk@latest

Note

Você pode instalar uma versão posterior do @angular/cli. No entanto, se você instalar uma versão superior à 20.3.25, verá um aviso durante a etapa de build gulp dizendo que a versão local da CLI não corresponde à versão instalada.

Prepare seu ambiente para carregamento lateral

Depois de criar sua extensão, você vai querer carregá-la localmente no Windows Admin Center para testá-la. Para isso, execute as etapas a seguir uma única vez no diretório de desenvolvimento da sua extensão:

1. Abra o PowerShell como administrador e crie um diretório de certificados:

   New-Item -ItemType Directory -Path "C:<path>\certificate"
   

2. Gerar um certificado autoassinado usando o OpenSSL do Git:

   & "C:\Program Files\Git\usr\bin\openssl.exe" req -x509 -newkey rsa:2048 -nodes -keyout C:\<path-to-extension-directory>\certificate\localhost.key -out C:\<path-to-extension-directory>\certificate\localhost.cert -days 365 -subj "/CN=localhost" -addext "subjectAltName=DNS:localhost"
   

3. Importe o novo certificado para sua Trusted Root:

    Import-Certificate -FilePath "C:\<path-to-extension-directory>\certificate\localhost.cert" -CertStoreLocation "Cert:\LocalMachine\Root"
   

4. Abra C:\Program Files\WindowsAdminCenter\Service\appsettings.json no Visual Studio Code como administrador.
5. Encontre a matriz corsSites e adicione a URL de carregamento lateral (a porta 4200 é a porta padrão).

    "CorsSites": [
      "https://localhost:4200"
    ]
   

6. Encontre a matriz CSPFrameAncestors e adicione a URL de carregamento lateral (4200 é a porta padrão).

    "CSPFrameAncestors": [
      "'self'",
      ... existing entries ...
      "https://localhost:4200"
    ]
   

7. Salve o arquivo e então reinicie o serviço Windows Admin Center na sua janela PowerShell de administrador executando:

     Restart-Service WindowsAdminCenter
   

Importante

Essas instruções fazem referência a certificados autoassinados para desenvolvimento e testes. Não use certificados autoassinados em máquinas de produção para cargas de trabalho de produção.

Sideloading usando um nome de domínio totalmente qualificado

Para carregar manualmente sua extensão do Windows Admin Center usando uma URL que inclua o nome de domínio totalmente qualificado (FQDN) do seu computador, siga estas etapas adicionais de configuração:

1. Use o OpenSSL do Git para gerar um certificado autoassinado que contenha nomes alternativos do assunto para localhost e o FQDN:

   & "C:\Program Files\Git\usr\bin\openssl.exe" req -x509 -newkey rsa:2048 -nodes -keyout C:\<path-to-extension-directory>\certificate\localhost.key -out C:\<path-to-extension-directory>\certificate\localhost.cert -days 365 -subj "/CN=localhost" -addext "subjectAltName=DNS:localhost,DNS:<FQDN>"
   

2. Importe o novo certificado para sua Trusted Root:

    Import-Certificate -FilePath "C:\<path-to-extension-directory>\certificate\localhost.cert" -CertStoreLocation "Cert:\LocalMachine\Root"
   

3. Atualização C:\Program Files\WindowsAdminCenter\Service\appsettings.json para incluir URLs com origem FQDN:

    "CorsSites": [
      "https://localhost:4200",
      "https://<FQDN>:4200"
    ],
    "CSPFrameAncestors": [
      "'self'",
      ... existing entries ...
      "https://localhost:4200",
      "https://<FQDN>:4200"
    ]
   

4. Salve o arquivo e então reinicie o serviço Windows Admin Center na sua janela PowerShell de administrador executando:

     Restart-Service WindowsAdminCenter
   

Próximas etapas

Agora que seu ambiente está preparado, você está pronto para começar a criar conteúdo.

• Criar uma extensão de ferramenta
• Criar uma extensão de solução
• Criar um plugin de gateway
• Saiba mais com nossos guias

Kit de ferramentas de design do SDK

Confira nosso kit de ferramentas de design do SDK do Windows Admin Center! Este kit de ferramentas foi projetado para ajudar você a simular rapidamente extensões no PowerPoint usando estilos de Windows Admin Center, controles e modelos de página. Veja como sua extensão pode parecer no Windows Admin Center antes de começar a programar!