Forms

O AEM oferece um serviço de formulários que assimila dados enviados em um documento do Microsoft Excel ou do Google Sheet.

Fazer com que os dados enviados por meio de formulários em seu site fluam diretamente para planilhas torna esses dados facilmente acessíveis aos usuários empresariais. Esses dados também podem interagir com fluxos de trabalho automatizados mais complexos, já que tanto o Google Sheets quanto o Microsoft Excel e o Sharepoint oferecem acesso a um ecossistema vibrante e APIs robustas.

Preparação de uma planilha para assimilação de dados

  1. Crie uma pasta de trabalho do Excel ou uma planilha do Google em qualquer lugar no diretório do projeto. Este documento usa uma planilha no OneDrive chamada email-form.xlsx na raiz de um projeto AEM.

  2. Verifique se o usuário AEM (por exemplo, helix@adobe.com) que está configurado para seu projeto tem editar permissão na folha.

  3. Abra a pasta de trabalho criada e renomeie a planilha padrão para incoming.


    Nota: O AEM não enviará dados para esta pasta de trabalho se a variável incoming a planilha não existe.

  4. Visualize a planilha no sidekick.
    Nota: Mesmo que uma planilha tenha sido visualizada anteriormente, ela deverá ser visualizada novamente após a criação do incoming pela primeira vez.

  5. Configure a planilha com os cabeçalhos que correspondem aos dados que estão sendo assimilados. Você pode fazer isso manualmente ou enviando uma solicitação POST para a rota do formulário no serviço de AEM Admin. O serviço de administração examinará os dados no corpo do POST e criará os cabeçalhos/tabelas e folhas necessários para assimilar dados e obter o máximo do serviço de formulários.
    Para obter detalhes sobre o formato da solicitação POST para configurar sua planilha, consulte o API de administração e o seguinte exemplo:

    Solicitação:

    code language-none
    POST /form/{owner}/{repo}/{ref}/en/email-form.json HTTP/1.1
    {"data":{"firstName":"test"}}
    

    Resposta:

    code language-none
    HTTP/1.1 200 OK
    {"rowCount":2,"columns":["firstName"]}
    

    Você pode usar uma ferramenta como curl ou Postman para fazer essa solicitação POST. Por exemplo:

    code language-none
    curl -s -i -X POST 'https://admin.hlx.page/form/{owner}/{repo}/{ref}/en/email-form.json' \
    --header 'Content-Type: application/json' \
    --data '{"data":{"firstName":"test"}}'
    

    Por meio da solicitação POST acima, estamos fornecendo dados de amostra, ou seja, os campos de formulário e valores de amostra que serão usados pelo serviço de Administração para configurar o formulário.
    O serviço de Administração é recomendado para configurar sua planilha, mas se você quiser criar os cabeçalhos manualmente, consulte o documento Configuração Manual do Forms Sheet.

  6. Após o envio do POST solicitação ao serviço de administração, você verá as seguintes alterações na pasta de trabalho.

    1. Uma planilha chamada helix-default é criado. Os dados nesta planilha são os que serão retornados quando uma GET solicitação é feita à planilha. Este é um ótimo local para usar fórmulas de planilha para resumir os dados do incoming folha para consumo noutro lugar.

      Nota: A variável helix-default A planilha nunca deve conter informações de identificação pessoal ou outros dados com os quais você não esteja de acordo em se tornar acessível publicamente.

    2. Uma planilha chamada slack foi criado. Aqui você pode configurar notificações automáticas para um canal Slack sempre que os dados forem assimilados em sua planilha. Atualmente, o AEM só oferece suporte a notificações para a organização slack de engenharia de AEM, bem como para a organização Adobe Enterprise Support.

      1. Para configurar notificações de Slack, insira o teamId do espaço de trabalho do Slack e do channel nome ou ID. Você também pode perguntar ao slack-bot (com a debug ) para o teamId e a variável channel ID. Usar o channel ID em vez do nome é preferível, pois sobrevive às renomeações de canal.

        Nota: Formulários mais antigos não tinham o teamId coluna. A variável teamId foi incluído na channel coluna, separada por uma # ou /.
      2. Insira qualquer título que você deseja e em campos insira os nomes dos campos que deseja ver na notificação Slack. Cada cabeçalho deve ser separado por vírgula (por exemplo, name, email).

Envio de Dados para sua Planilha

Agora a planilha está pronta para assimilação de dados e você pode enviar POST solicitações diretamente para a planilha em hlx.page, hlx.live ou seu domínio de produção.

POST https://ref–repo–owner.hlx.(page|live)/email-form
POST https://my-domain.com/email-form

Nota: O URL não deve incluir o .json extensão. A folha deve ser publicada para POST operações nas quais trabalhar .live ou no domínio de produção.

Há algumas maneiras diferentes de formatar os dados do formulário na variável POST organismo notificado.

  • Como uma matriz de pares de nome/valor
    https://gist.github.com/dylandepass/9ba6b83700dfce1fa90a47bde62c2e9
  • Como um objeto com pares chave/valor
    <script src=“https://gist.github.com/dylandepass/2b5f694723dfdb3d304fcafc613d6595.js”></script>
  • Como x-www-form-urlencoded corpo (content-type o cabeçalho deve ser definido como application/x-www-form-urlencoded)
    <script src=“https://gist.github.com/dylandepass/b72b2e30313bc80beb02e12b1d7201ff.js”></script>

Pronto! O serviço de formulários é executado a cada minuto, para que você veja rapidamente seus dados assimilados na planilha.

Forms criado pelo autor

Em muitos casos, é desejável que os autores criem formulários e decidam quais campos de formulário devem ser apresentados ao visitante do site. É comum usar a variável helix-default planilha da mesma que é usada para o envio do formulário como o local para permitir que o autor defina seus formulários.

Normalmente, há um bloco de formulários que faz referência à planilha e renderiza o formulário e lida com o fluxo do usuário por meio do envio.

Um exemplo simples de tal form bloco pode ser encontrado aqui e o bloco adaptável do Forms está disponível aqui.

Quando precisar de formulários com recursos como reCAPTCHA, acessibilidade, uploads de arquivo, validações de campo, assinatura eletrônica, monitoramento de desempenho, regras baseadas em planilha, documento de registro (DoR) e muito mais, use o 🔗 Bloco Forms adaptável. Ele é compatível com uma grande variedade de formulários, desde os simples que coletam informações básicas (como formulários de contato ou solicitações de serviço) até os complexos com várias seções, regras e integrações com o Adobe Sign, o Adobe Workfront e sistemas externos. Você pode até mesmo usá-los para enviar dados para planilhas ou se conectar a sistemas externos para formulários de nível empresarial. Para obter mais detalhes, confira 🔗 Documentação do AEM Forms Edge Delivery Services.

Veja o exemplo a seguir de como seria a planilha da definição do formulário.

Os campos de formulário compatíveis são extensíveis e a variável form O deve ser visto como um exemplo que oferece um ponto de partida.

Como exemplo, um formulário totalmente funcional foi adicionado a essa página, usando a base de código listada anteriormente simplesmente adicionando o seguinte bloco no Documento do Google:

Experimente e veja o fluxo de dados do formulário na planilha de entrada. Pode levar um minuto para ir do serviço de formulário para a planilha.

recommendation-more-help
10a6ce9d-c5c5-48d9-8ce1-9797d2f0f3ec