Capítulo 4 - Definição dos modelos do Content Services

O Capítulo 4 do tutorial AEM Headless aborda o papel dos modelos editáveis AEM no contexto dos serviços de conteúdo AEM. Modelos editáveis são usados para definir a estrutura de conteúdo JSON que o AEM Content Services expõe aos clientes por meio da composição de componentes AEM habilitados para o Content Services.

Compreender a função dos modelos nos serviços de conteúdo AEM

Modelos editáveis AEM são usados para definir os pontos de extremidade HTTP que são acessados para expor o conteúdo do Evento como JSON.

Tradicionalmente, os modelos editáveis com AEM são usados para definir páginas da Web, no entanto, esse uso é simplesmente convencional. Modelos editáveis podem ser usados para compor qualquer conjunto de conteúdo; como esse conteúdo é acessado: como um HTML em um navegador, como JSON consumido pelo JavaScript (editor de SPA do AEM) ou um aplicativo móvel é uma função de como essa página é solicitada.

No AEM Content Services, os modelos editáveis são usados para definir como os dados JSON são expostos.

Para o WKND Mobile Criaremos um único Modelo editável usado para direcionar um único endpoint de API. Embora este exemplo seja simples de ilustrar os conceitos de AEM Headless, você pode criar várias páginas (ou pontos de extremidade), cada uma expondo diferentes conjuntos de conteúdo para criar uma API mais complexa e mais bem organizada.

Noções básicas sobre o endpoint da API

Para entender como compor nosso endpoint de API e entender qual conteúdo deve ser exposto ao nosso WKND Mobile App, vamos rever o design.

Decomposição de página da API de eventos

Como podemos ver, temos três conjuntos lógicos de conteúdo para fornecer ao aplicativo móvel.

  1. A variável Logotipo
  2. A variável Linha de tag
  3. A lista de Eventos

Para fazer isso, podemos mapear esses requisitos para componentes AEM (e, no nosso caso, AEM WCM Componentes principais) para expor o conteúdo necessário como JSON.

  1. A variável Logotipo é revelado através de um Componente de imagem
  2. A variável Linha de tag é revelado através de um Componente de texto
  3. A lista de Eventos é revelado através de um Componente da lista de fragmentos do conteúdo que, por sua vez, faz referência a um conjunto de Fragmentos de conteúdo do evento.
NOTE
Para suportar a exportação JSON de páginas e componentes do serviço de conteúdo AEM, as páginas e os componentes devem derivar dos componentes principais do WCM no AEM.
Componentes principais do WCM no AEM têm funcionalidade integrada para suportar um esquema JSON normalizado de Páginas e Componentes exportados. Todos os componentes do WKND Mobile usados neste tutorial (Página, Imagem, Texto e Lista de fragmentos de conteúdo) são derivados dos Componentes principais do WCM no AEM.

Definição do modelo de API de eventos

  1. Navegue até Ferramentas > Geral > Modelos >WKND Mobile.

  2. Crie o Events API modelo:

    1. Toque Criar na barra de ação superior
    2. Selecione o WKND Mobile - Empty Page modelo
    3. Toque Próxima na barra de ação superior
    4. Enter Events API no Título do modelo campo
    5. Toque Criar na barra de ação superior
    6. Toque Abertura abrir o novo modelo para edição
  3. Primeiro, permitimos os três componentes do AEM identificados de que precisamos para modelar o conteúdo editando o Política da Raiz Contêiner de layout. Assegure a Estrutura estiver ativo, selecione a variável Layout Container [Root] e toque no Política botão.

  4. Em Propriedades > Componentes permitidos pesquisar WKND Mobile. Permitir os seguintes componentes do WKND Mobile grupo de componentes para que possam ser usados no Events API.

    • WKND Mobile > Image

      • O logotipo do aplicativo
    • WKND Mobile > Text

      • O texto de introdução do aplicativo
    • WKND Mobile > Content Fragment List

      • A lista de categorias de Evento disponíveis para exibição no aplicativo
  5. Toque no Concluído marca de seleção no canto superior direito ao concluir.

  6. Atualizar a janela do navegador para ver as novas Componentes permitidos no painel esquerdo.

  7. No localizador Componentes no painel à esquerda, arraste os seguintes Componentes AEM:

    1. Image para o logotipo
    2. Text para a linha da tag
    3. Content Fragment List para os eventos
  8. Para cada um dos componentes acima, selecione-os e pressione a tecla desbloquear botão.

  9. No entanto, assegurar a contêiner de layout é bloqueado para impedir que outros componentes sejam adicionados ou que esses três componentes sejam removidos.

  10. Toque Informações da página > Exibir no Administrador para retornar ao WKND Mobile listagem de modelos. Selecione o recém-criado Events API modelo e toque em Ativar na barra de ação superior.

NOTE
Observe que os componentes usados para exibir o conteúdo são adicionados ao próprio modelo e bloqueados. Isso permite que os autores editem os componentes predefinidos, mas não adicionem ou removam componentes arbitrariamente, pois alterar a própria API pode quebrar as suposições em torno da estrutura JSON e quebrar aplicativos de consumo. Todas as APIs precisam ser estáveis.

Próximas etapas

Como opção, instale o com.adobe.aem.guides.wknd-mobile.content.chapter-4.zip pacote de conteúdo no AEM Author via Gerenciador de pacotes AEM. Este pacote contém as configurações e o conteúdo descritos neste e nos capítulos anteriores do tutorial.

recommendation-more-help
e25b6834-e87f-4ff3-ba56-4cd16cdfdec4