Capítulo 5: Creación de páginas de servicios de contenido

AEM El capítulo 5 del tutorial sin encabezado de trata la creación de la página a partir de las plantillas definidas en el capítulo 4. La página creada en este capítulo actuará como punto final HTTP JSON para la aplicación móvil.

NOTE
La arquitectura de contenido de página de /content/wknd-mobile/en/api se ha generado previamente. Las páginas base de en y api tienen un propósito arquitectónico y organizativo, pero no son estrictamente necesarias. Si el contenido de la API se puede localizar, se recomienda seguir las prácticas recomendadas habituales de organización de páginas de Language Copy y de Multi-site Manager, ya que la página de la API se puede localizar como cualquier página de AEM Sites.

Creación de la página de API de eventos

  1. AEM Vaya a ​ > Sitios > WKND Mobile > English >API.

  2. Puntee en la etiqueta de la página API y, a continuación, pulse el botón Crear en la barra de acciones superior y cree una nueva página de API de eventos en la página de la API.

    1. Pulse Crear en la barra de acciones superior
    2. Seleccione la plantilla API de eventos
    3. En el campo Nombre escriba eventos
    4. En el campo Título, introduzca API de eventos
    5. Pulse Crear en la barra de acciones superior para crear la página
    6. Pulse Listo para regresar al administrador de AEM Sites

Creación de la página de API de eventos

NOTE
El proyecto proporciona CSS para proporcionar algunos estilos básicos para la experiencia del autor.
  1. AEM Edite la página API de eventos. Para ello, vaya a > Sitios > WKND Mobile > Inglés > API, seleccione la página API de eventos y pulse Editar en la barra de acciones superior.

  2. Agregue una imagen de logotipo para mostrarla en la aplicación; para ello, arrástrela desde el Buscador de recursos al marcador de posición del componente Imagen.

    • Utilice el logotipo proporcionado que se encuentra en /content/dam/wknd-mobile/images/wknd-logo.png.
  3. Agregue línea de etiqueta para mostrar encima de los eventos.

    1. Editar el componente Texto
    2. Introduzca el texto:
      • The WKND is here.
  4. Seleccione los eventos que se mostrarán:

    1. Establezca la siguiente configuración en la ficha Propiedades:

      • Modelo: Event
      • Ruta principal: /content/dam/wknd-mobile/en/events
      • Etiquetas: <Dejar en blanco>
    2. Establezca la siguiente configuración en la ficha Elementos:

      • Elimine cualquier elemento de la lista para garantizar que TODOS los elementos de los fragmentos de contenido de evento estén expuestos.

Revise la salida JSON de la página de la API

La salida JSON y su formato se pueden revisar solicitando la página con el selector .model.json.

Los consumidores de esta API deben entender bien esta estructura (o esquema) JSON. Es fundamental que los consumidores de API entiendan qué aspectos de la estructura son fijos (por ejemplo, el logotipo de la API del evento (imagen) y la etiqueta en directo (texto) y que son fluidos (por ejemplo, los eventos enumerados en el componente Lista de fragmentos de contenido ).

La ruptura de este contrato en una API publicada puede provocar un comportamiento incorrecto en las aplicaciones consumidoras.

  1. AEM En las nuevas pestañas del explorador, solicite las páginas de la API de eventos mediante el selector .model.json, que invoca el exportador JSON de los servicios de contenido, y serializa la página y los componentes en una estructura JSON normalizada y bien definida.

    La estructura JSON producida por estas páginas es la estructura a la que las aplicaciones consumidoras deben alinearse.

  2. Solicite la página API de eventos como JSON.

    El resultado debe ser similar al siguiente:

AEM Salida JSON de servicios de contenido de

NOTE
Este JSON se puede generar de manera ordenada (con formato) para que sea legible en lenguaje natural mediante el selector .tidy:

Siguiente paso

AEM AEM De forma opcional, instale el paquete de contenido com.adobe.aem.guides.wknd-mobile.content.chapter-5.zip en Author o a través del Administrador de paquetes de 🔗. Este paquete contiene las configuraciones y el contenido descritos en este y en los capítulos anteriores del tutorial.

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