Gerar visualização de HTML5 de um formulário XDP

Ao projetar um formulário no AEM Forms Designer, além de visualizar a representação de PDF de um formulário, você também pode visualizar uma representação de HTML5 dele. Você pode usar o Visualizar HTML para visualizar um formulário como ele apareceria em um navegador.

Ativar a Visualização do HTML para formulários XDP no Designer

Para permitir que o Designer gere a visualização de HTML de formulários XDP, execute as seguintes configurações:

  • Configurar o serviço de autenticação do Apache Sling
  • Desativar modo protegido
  • Fornecer detalhes do servidor AEM Forms

Configurar o serviço de autenticação do Apache Sling

  1. Ir para https://'[server]:[port]'/system/console/configMgr no AEM Forms em execução no OSGi ou
    https://'[server]:[port]'/lc/system/console/configMgr no AEM Forms em execução no JEE.

  2. Localize e clique em Serviço de autenticação do Apache Sling para abri-la no modo de edição.

  3. Dependendo de você estar executando o AEM Forms em OSGi ou JEE, adicione o seguinte no Requisitos de autenticação campo :

    • AEM Forms no JEE

      • -/content/xfaforms
      • -/etc/clientlibs

    • AEM Forms no OSGi

      • -/content/xfaforms
      • -/etc/clientlibs/fd/xfaforms
    OBSERVAÇÃO

    Não copie e cole o valor especificado no campo Requisitos de autenticação , pois ele pode corromper os caracteres especiais no valor. Em vez disso, digite o valor especificado no campo .

  4. Especifique um nome de usuário e senha em Nome de usuário anônimo e Senha do usuário anônimo , respectivamente. As credenciais especificadas são usadas para lidar com autenticação anônima e permitir acesso a usuários anônimos.

  5. Clique em Salvar para salvar a configuração.

Desativar modo protegido

O modo protegido está ativada, por padrão. Mantenha-o ativado para os ambientes de produção. Você pode desativá-lo em um ambiente de desenvolvimento para visualizar o HTML5 Forms no Designer. Execute as seguintes etapas para desativá-lo:

  1. Faça logon no Console da Web AEM como administrador.

    • URL para AEM Forms em OSGi é https://'[server]:[port]'/system/console/configMgr
    • O URL para AEM Forms no JEE é https://'[server]:[port]'/lc/system/console/configMgr

  2. Abrir Configurações do Mobile Forms para edição.

  3. Desmarque a opção Modo protegido e clique em Salvar.

Fornecer detalhes do servidor AEM Forms

  1. No Designer, acesse Ferramentas > Opções.

  2. Na janela Opções, selecione Opções de servidor forneça os detalhes a seguir e clique em OK.

    • URL do servidor: URL do servidor AEM Forms.

    • Número da porta HTTP: AEM porta do servidor. O valor padrão é 4502.

    • Contexto de visualização do HTML: Caminho do perfil para renderizar formulários XFA. Os perfis padrão a seguir são usados para visualizar o formulário no Designer. No entanto, também é possível especificar o caminho para um perfil personalizado.

      • /content/xfaforms/profiles/default.html (AEM Forms no OSGi)

      • /lc/content/xfaforms/profiles/default.html (AEM Forms no JEE)

    • Contexto do Forms Manager: Caminho do contexto no qual a interface do usuário do Forms Manager é implantada. Os valores padrão são:

      • /aem/forms (AEM Forms no OSGi)
      • /lc/forms (AEM Forms no JEE)
    OBSERVAÇÃO

    Certifique-se de que o servidor do AEM Forms esteja funcionando. A visualização do HTML se conecta ao servidor CRX para generate uma pré-visualização.

    Opções do AEM Forms Designer

    Opções do AEM Forms Designer

  3. Para visualizar um formulário no HTML, clique no Visualizar HTML guia .

    OBSERVAÇÃO
    • Se a guia HTML Preview estiver fechada, pressione F4 para abrir a guia Preview HTML. Você também pode selecionar Visualizar HTML no menu Visualizar para abrir a guia Visualizar HTML.
      • A visualização HTML não oferece suporte a documentos PDF, a visualização HTML é apenas para documentos XDP.
    ATENÇÃO

    Para testar a experiência real do usuário final, visualize seus formulários em navegadores externos (Google Chrome, Microsoft Edge, Mozilla Firefox e muito mais) também. Cada navegador usa um mecanismo separado para renderizar o HTML, de modo que pode haver algumas diferenças no modo como um formulário é visualizado no Designer e no navegador externo.

Visualização de formulário usando dados de formulário

O Designer permite visualizar e testar o formulário usando dados XML de amostra. É recomendável testar frequentemente o formulário com dados de amostra para garantir que o formulário seja renderizado de forma correta.

Se não houver dados de amostra, o Designer poderá criá-los ou você mesmo poderá criá-los. (Consulte Para gerar automaticamente os dados de amostra para visualizar um formulário e Para criar dados de amostra para visualizar um formulário.)

Testar seu formulário usando uma fonte de dados de amostra garante que os dados e campos sejam mapeados e que os subformulários repetitivos se repetem conforme o esperado. Você pode criar um layout equilibrado de formulário que proporciona o espaço adequado para que cada objeto apresente os dados unidos.

  1. Selecionar Arquivo > Propriedades do formulário.

  2. Clique no botão Visualizar e, na caixa Arquivo de dados, digite o caminho completo para o arquivo de dados de teste. Você também pode usar o botão Procurar para navegar até o arquivo.

  3. Clique em OK. Na próxima vez que você visualizar o formulário na Visualizar HTML , os valores de dados do arquivo XML de amostra aparecerão nos respectivos objetos.

Visualizar formulários localizados em um repositório

No AEM Forms, é possível visualizar formulários e documentos em um repositório. A visualização ajuda a saber exatamente como os formulários se parecem e se comportam conforme serão usados pelos usuários finais.

Nesta página