Adicionar um iFrame para uma extensão de ferramenta

Neste artigo, adicionaremos um iFrame a uma nova extensão de ferramenta vazia que criamos com a CLI do Windows Admin Center.

Prepare o seu ambiente

Caso ainda não tenha feito isso, siga as instruções em Desenvolver uma extensão de ferramenta para preparar seu ambiente e criar uma nova extensão de ferramenta vazia.

Adicionar um módulo ao seu projeto

Adicione um novo módulo vazio ao seu projeto, ao qual adicionaremos um iFrame na próxima etapa.

Adicionar um iFrame ao módulo

Agora, adicionaremos um iFrame a esse novo módulo vazio que acabamos de criar.

Em \src\app, procure a pasta do módulo e abra o arquivo {!module-name}.component.html, encontrado com a seguinte convenção de nomenclatura:

Valor Explicação Exemplo de nome de arquivo
{!module-name} Seu nome do módulo (letras minúsculas, espaços substituídos por traços) manage-foo-works-portal.component.html

Adicione o seguinte conteúdo ao arquivo HTML:

<div>
  <iframe  style="height: 850px;" src="https://www.bing.com"></iframe>
</div>

Muito bem, você adicionou um iFrame à sua extensão. Em seguida, você pode criar e carregar a extensão no Windows Admin Center para ver os resultados.

Observação

As configurações da CSP (Política de Segurança de Conteúdo) podem impedir que alguns sites sejam renderizados em um iFrame no Windows Admin Center. Você pode aprender mais sobre isso aqui.