Prepare seu ambiente de desenvolvimento

  • Aplica-se a: ✅ Windows Admin Center, ✅ Windows Admin Center Preview

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 para criar e testar uma extensão para o Windows Admin Center.

Note

Novo no SDK do Windows Admin Center? Saiba mais sobre Extensões para o Windows Admin Center

Sugestão

Crie uma pasta para guardar todos os ficheiros 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:

Pré-requisitos de instalação

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

Para ignorar a validação de assinatura que ocorre durante a instalação da extensão em 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 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

De seguida, instale ou atualize as dependências necessárias para os seus projetos usando o Node Gestor de Pacotes. Instale estas dependências globalmente para que todos os projetos possam aceder a elas.

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

Pode instalar uma versão posterior de @angular/cli. No entanto, se instalar uma versão superior à 20.3.25, verá um aviso durante a etapa de compilação gulp de que a versão local da CLI não corresponde à versão instalada.

Prepare o seu ambiente para o carregamento lateral

Depois de criares a tua extensão, vais querer carregá-la lateralmente no Windows Admin Center para fins de teste. Para tal, execute os seguintes passos únicos para o seu diretório de desenvolvimento de extensões:

  1. Abra o PowerShell como administrador e crie um diretório de certificados: 
    New-Item -ItemType Directory -Path "C:<path>\certificate"
  2. Gera 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. Importa o novo certificado para o teu 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 com privilégios de administrador.
  5. Encontre a matriz corsSites e adicione o endereço URL de carregamento lateral (a porta 4200 é usada por predefinição). 
     "CorsSites": [
   "https://localhost:4200"
 ]
  6. Encontre o CSPFrameAncestors array e adicione o URL de sideloading (a porta 4200 é a predefinida). 
     "CSPFrameAncestors": [
   "'self'",
   ... existing entries ...
   "https://localhost:4200"
 ]
  7. Guarde o ficheiro e depois reinicie o serviço Windows Admin Center na sua janela PowerShell de administrador executando:
      Restart-Service WindowsAdminCenter

Important

Estas instruções referem-se a certificados auto-assinados para desenvolvimento e testes. Não uses certificados auto-assinados em máquinas de produção para cargas de trabalho de produção.

Sideloading usando um nome de domínio totalmente qualificado

Para instalar manualmente a sua extensão do Windows Admin Center através de um URL que inclua o nome de domínio totalmente qualificado (FQDN) da sua máquina, siga estes passos adicionais de configuração:

  1. Utilize o OpenSSL do Git para gerar um certificado autoassinado que contenha nomes alternativos do requerente tanto para localhost como para 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. Importa o novo certificado para o teu 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. Guarde o ficheiro e depois reinicie o serviço Windows Admin Center na sua janela PowerShell de administrador executando:
      Restart-Service WindowsAdminCenter

Próximos passos

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

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 ajudá-lo a simular rapidamente extensões no PowerPoint usando estilos, controles e modelos de página do Windows Admin Center. Veja como pode ser a sua extensão no Windows Admin Center antes de começar a codificar!

  • Last updated on