Implemente su primera aplicación SAPUI5

Deja un comentario / Tutoriales de sap

Paso 1: abre el espacio de desarrollo de Fiori

Comienzo escriba dev space SAP Fiori y abierto haciendo clic en su nombre.

Consulte este tutorial si no está seguro de cómo llegar aquí o cómo crear un espacio de desarrollo.

Hecho

Inicie sesión para responder la pregunta

Paso 2: crea un destino UI5

Cree un nuevo destino llamado «ui5» que apunte a la URL https://sapui5.hana.ondemand.com/. Aquí es donde obtendremos las librerías UI5 estándar más adelante.

Hecho

Inicie sesión para responder la pregunta

Paso 3: conectarse al punto final de Cloud Foundry

Asegúrese de estar conectado al punto final de Foundry Cloud donde utilizará la aplicación SAPUI5 más adelante.

  1. Haga clic en en la esquina inferior izquierda de la pantalla para iniciar el flujo de conexión.

    no conectado

  2. Ingrese el punto final de Foundry Cloud que desea utilizar. Si su entorno se ejecuta en la región EU10, este es el https://api.cf.eu10.hana.ondemand.com. Ingrese su correo electrónico y contraseña para continuar.

    seleccione Endpoint

  3. Luego, debe seleccionar Foundry Cloud Organization y usar el espacio que necesita. Verá que está conectado al punto final cuando se respondan estos mensajes.

    linkEndpoint

Hecho

Inicie sesión para responder la pregunta

Paso 4: crear un nuevo proyecto de módulo único

Este paso lo guiará a través de las acciones necesarias para crear un proyecto que contenga un único Aplicación SAPUI5. En caso de que desee crear un proyecto que contenga varios módulos de IU, no siga estas instrucciones y cree un proyecto MTA vacío al que agregue varios módulos de IU.

  1. Clic en el enlace Empezar desde la plantilla sobre el Bienvenida pantalla.

    nuevo proyecto

  2. Escoger Aplicación SAPUI5 de estilo libre SAP Fiori como la categoría de plantillas que desea utilizar y haga clic en Comienzo.

    fioriTemplate

  3. Especifique el tipo de aplicación Estilo libre SAPUI5 y plano de planta Aplicación SAPUI5 y ve al Hacia adelante pantalla.

    sapui5Template

  4. Ahora tiene la opción de conectar su aplicación SAPUI5 a una fuente de datos. Debido a que no necesitaremos una fuente de datos en este tutorial, seleccione Dada y haga clic en Hacia adelante.

    sin datos

  5. Mantenga el nombre de vista predeterminado y haga clic en Hacia adelante .

    viewname

  6. Nombre del módulo sapui5, usa el título de la aplicación Tutorial, define el nombre del espacio sap.btp, y Agregar configuración de implementación. Mantenga los valores predeterminados para los otros parámetros y seleccione Hacia adelante continúe con el siguiente paso.

    proyecto

  7. Escoger Fundición en la nube como fecha límite actual y escriba cualquier valor para el destino porque es un campo obligatorio. Prensa Finalizar para crear el nuevo proyecto.

    terminarProyecto

  8. Cuando vea el mensaje de éxito, haga clic en Abrir en un nuevo espacio de trabajo para abrir el nuevo proyecto.

    openws

Hecho

Inicie sesión para responder la pregunta

Paso 5: enrutador de aplicaciones administradas

El proyecto ya se puede implementar tal como está. Pero falta una cosa para que sea accesible desde su navegador: el enrutador de la aplicación administrada:

  1. Haga clic derecho en el mta.yaml archivo y seleccione Cree un módulo MTA a partir de la plantilla.

    newmod

  2. Escoger Configuración del enfoque y Comienzo para continuar en el asistente.

    apputer

  3. Escoger Enfoque gestionado porque no es necesario extender el conector y reducir el TCO del proyecto. Ingresar basic.service como el nombre del servicio comercial de éxito Hacia adelante cerrar en el asistente.

    apputer

  4. Ahora necesitamos reutilizar este servicio comercial en nuestra aplicación web. Abierto webapp/manifest.json y agregue las siguientes líneas.

    {
    "_version": "1.29.0",
    "sap.app": {
        "id": "sap.btp.sapui5",
        "type": "application",
        "i18n": "i18n/i18n.properties",
        "applicationVersion": {
            "version": "1.0.0"
        },
        "title": "",
        "description": "",
        "resources": "resources.json",
        "ach": "ach"
    },
    "sap.cloud": {
        "service": "basic.service"
    },
    "sap.ui": {
    ...

  5. Actualmente, hay un problema técnico en el asistente que debemos solucionar manualmente. Ve a la mta.yaml archivo y agregue la línea resaltada.

    _schema-version: "3.2"
ID: sap-btp-sapui5
description: A Fiori application.
version: 0.0.1
modules:
  ...
  - name: sap-btp-sapui5-destination-content
    type: com.sap.application.content
    requires:
    - name: sap-btp-sapui5-destination-service
      parameters:
        content-target: true
    - name: sap-btp-sapui5-html5-repo-host
      parameters:
        service-key:
          name: sap-btp-sapui5-html5-repo-host-key
    - name: uaa_sap-btp-sapui5
      parameters:
        service-key:
          name: uaa_sap-btp-sapui5-key
    parameters:
      content:
        instance:
          destinations:
          - Name: basic_service_sap_btp_sapui5_html5_repo_host
            ServiceInstanceName: sap-btp-sapui5-html5-repo-host
            ServiceKeyName: sap-btp-sapui5-html5-repo-host-key
            sap.cloud.service: basic.service
          - Authentication: OAuth2UserTokenExchange
            Name: basic_service_uaa_sap_btp_sapui5
            ServiceInstanceName: sap-btp-sapui5-xsuaa-service
            ServiceKeyName: uaa_sap-btp-sapui5-key
            sap.cloud.service: basic.service
          existing_destinations_policy: ignore
    build-parameters:
      no-source: true
   ...

Hecho

Inicie sesión para responder la pregunta

Paso 6: compila la aplicación

Lleve (también conocido como paquete) el proyecto a mtar archivo para su implementación en Cloud Foundry.

  1. Haga clic derecho en el mta.yaml archivo y seleccione Toma MTA para estimular este proceso.

    construir

  2. Cuando se completa la construcción, puede ver un mensaje en el registro. Puedes conseguir la generación ahora mtar archivo en el árbol del proyecto sobre mta_archives.

    Expresar

Hecho

Inicie sesión para responder la pregunta

Paso 7: Implementar el archivo en Cloud Foundry

Ahora que ha creado un mtar archive, todos deben usar la aplicación.

  1. Haga clic derecho en el mtar archivo y seleccione Despliegue y Implementar un archivo MTA.

    despliegue

  2. Verifique la salida de la consola para asegurarse de que el proceso haya comenzado.

  3. Verá el mensaje de éxito y la URL de la aplicación en el inicio de sesión cuando se complete la implementación.

    rath

  4. Puede ver la URL de la aplicación implementada mientras la ejecuta cf html5-list -di sap-btp-sapui5-destination-service -u en una nueva sesión de terminal.

    cfapps

    Necesitas el cpp le launchpad, en caso de que utilice el servicio Launchpad (en lugar del servicio Portal).

Hecho

Inicie sesión para responder la pregunta

Paso 8: prueba la aplicación

  1. Abierto la aplicación en su navegador. Es posible que deba iniciar sesión con su ID de SAP (las mismas credenciales que usa para SAP BTP Cockpit).

  2. Vea que la aplicación de muestra contiene un encabezado y una página en blanco. Entonces deberías ver algo como esto:

aip

Ingrese la URL de su aplicación actual:

Seguro que también te interesa

Deja un comentario

Tu dirección de correo electrónico no será publicada.