Adición del SDK de MobileFirst Foundation a aplicaciones Ionic

improve this page | report issue

Visión general

En esta guía de aprendizaje, aprenderá a añadir el SDK de MobileFirst a una aplicación Ionic nueva o existente, creada con la CLI de Ionic. También aprenderá a configurar MobileFirst Server para que reconozca la aplicación, y a buscar información sobre los archivos de configuración de MobileFirst que se cambian en el proyecto.

El SDK de MobileFirst Ionic se proporciona como un conjunto de Typescript Wrappers junto con los plug-ins de Cordova y se registra en NPM.

Los plugins disponibles son:

  • cordova-plugin-mfp - El núcleo de SDK
  • cordova-plugin-mfp-push - Proporciona soporte de notificaciones push
  • cordova-plugin-mfp-jsonstore - Proporciona soporte JSONStore

Niveles de soporte

Las versiones de la plataforma Ionic Cordova soportadas por los plug-ins de MobileFirst son:

  • cordova-ios: >= 4.1.1 y < 5.0
  • cordova-android: >= 6.1.2 y < 7.0
  • cordova-windows: >= 4.3.2 y < 6.0

Ir a:

Componentes del SDK de Ionic

cordova-plugin-mfp

El plug-in cordova-plugin-mfp es el plug-in principal de MobileFirst para Cordova y es necesario. Si instala cualquier otro plug-in de MobileFirst, también se instala automáticamente el plug-in cordova-plugin-mfp en el caso de que todavía no lo esté.

Los siguientes plugins de Cordova se instalan como dependencias de cordova-plugin-mfp:

  • cordova-plugin-device
  • cordova-plugin-dialogs
  • cordova-plugin-globalization
  • cordova-plugin-okhttp

cordova-plugin-mfp-jsonstore

El plugin de cordova-plugin-mfp-jsonstore habilita que su aplicación utilice JSONstore. Para obtener más información sobre JSONstore, consulte la guía de aprendizaje de JSONStore.

cordova-plugin-mfp-push

El plugin cordova-plugin-mfp-push proporciona los permisos necesarios para utilizar notificaciones push desde MobileFirst Server para aplicaciones Android. Se necesita una configuración adicional para utilizar notificaciones push. Para obtener más información sobre las notificaciones push, consulte la guía de aprendizaje de Notificaciones push.

cordova-plugin-mfp-fips

El plugin cordova-plugin-mfp-fips proporciona soporte FIPS 140-2 para la plataforma Android. Para obtener más información, consulte el apartado Soporte FIPS 140-2.

cordova-plugin-mfp-encrypt-utils

El plugin cordova-plugin-mfp-encrypt-utils proporciona infraestructuras de cifrado iOS OpenSSL para las aplicaciones Cordova con la plataforma iOS. Para obtener más información, consulte Habilitación de OpenSSL para Cordova iOS.

Requisitos previos:

  • CLI de Ionic y MobileFirst CLI están instalados en la estación de trabajo del desarrollador.
  • Una instancia remota o local de MobileFirst Server que esté en ejecución.
  • Lea las guías de aprendizaje Configuración del entorno de desarrollo de MobileFirst y Configuración del entorno de desarrollo de Cordova.
  • Para cordova-windows, debe instalarse una versión de Visual C++ que sea compatible con las versiones de Visual Studio y .NET instaladas en la máquina.
  • En el caso de Visual Studio Tools for Universal Windows Apps, asegúrese de que las aplicaciones cordova-windows creadas tengan todas las bibliotecas de soporte necesarias.

Adición del SDK de Mobile Foundation Ionic

Siga las instrucciones siguientes para añadir el SDK de Mobile Foundation Ionic a un proyecto nuevo o existente de Ionic, y regístrelo en MobileFirst Server.

Antes de empezar, asegúrese de que MobileFirst Server está en ejecución.
Si está utilizando un servidor instalado localmente, desde una ventana de línea de mandatos, vaya a la carpeta del servidor y ejecute el mandato: ./run.sh.

Adición del SDK

Considere la posibilidad de crear el proyecto mediante la plantilla de aplicación de MobileFirst. La plantilla añade las entradas de plug-in específicas necesarias de MobileFirst al archivo config.xml del proyecto de Ionic y proporciona un archivo index.js específico de MobileFirst, listo para ser utilizado, y que está configurado para el desarrollo de aplicaciones de MobileFirst.

Nueva aplicación

  1. Cree un proyecto de Ionic: ionic start projectName starter-template.
    Por ejemplo:

    ionic start Hello blank
    
    • “Hello” es el nombre de carpeta y el nombre de la aplicación.
    • “blank” es el nombre de la plantilla de iniciador.

    El archivo index.js de la plantilla permite utilizar características de MobileFirst adicionales como, por ejemplo, la traducción de aplicación multilingüe y opciones de inicialización (consulte la documentación del usuario para obtener más información).

  2. Cambie el directorio a la raíz del proyecto de Ionic: cd hello

  3. Añada los plug-ins de MobileFirst utilizando el mandato de la CLI de Ionic: ionic cordova plugin add cordova-plugin-name Por ejemplo:

    ionic cordova plugin add cordova-plugin-mfp
    

    El mandato anterior añade el plug-in del SDK de MobileFirst Core al proyecto de Ionic.

  4. Añada una o más plataformas soportadas al proyecto de Cordova mediante el mandato de la CLI de Ionic: ionic cordova platform add ios|android|windows|browser. Por ejemplo:

    cordova platform add ios
    
  5. Prepare los recursos de la aplicación ejecutando el mandato ionic cordova prepare:

    ionic cordova prepare
    

Aplicación existente

Vaya a la raíz de su proyecto Ionic existente y añada el plug-in de Ionic Cordova central de MobileFirst:

   ionic cordova plugin add cordova-plugin-mfp

Los métodos de API de MobileFirst estarán disponibles después de que se haya cargado el SDK de cliente de MobileFirst. Se llama entonces al suceso mfjsloaded.

Registro de la aplicación

  1. Abra una ventana de línea de mandatos y vaya a la raíz del proyecto Ionic.

  2. Registre la aplicación en MobileFirst Server:

    mfpdev app register
    

El mandato de CLI mfpdev app register primero se conecta a MobileFirst Server para registrar la aplicación y, a continuación, actualiza el archivo config.xml en la raíz del proyecto Ionic con metadatos que identifican a MobileFirst Server.

Cada plataforma se registra como una aplicación en MobileFirst Server.

Sugerencia: También es posible registrar aplicaciones desde MobileFirst Operations Console:

  1. Cargue MobileFirst Operations Console.
  2. Pulse el botón Nuevo junto a Aplicaciones para registrar una nueva aplicación y seguir las instrucciones en la pantalla.

Utilización del SDK

Los métodos de API de MobileFirst estarán disponibles después de que se haya cargado el SDK de cliente de MobileFirst. Se llama entonces al suceso mfjsloaded.
Llame a los diversos métodos de la API de MobileFirst solo después de que se haya llamado al suceso.

Actualización del SDK de MobileFirst Ionic

Para actualizar el SDK de MobileFirst Ionic Cordova con el último release, elimine el plug-in cordova-plugin-mfp: ejecute el mandato ionic cordova plugin remove cordova-plugin-mfp y, a continuación, ejecute el mandato ionic cordova plugin add cordova-plugin-mfp para añadirlo de nuevo.

Los releases de SDK se pueden encontrar en el repositorio NPM de SDK.

Artefactos generados del SDK de MobileFirst Ionic

config.xml

El archivo de configuración de Ionic es un archivo XML necesario que contiene metadatos de aplicación y que se almacena en el directorio raíz de la aplicación.
Después de que el SDK de MobileFirst Ionic se añada al proyecto, el archivo config.xml que genera Ionic recibe un conjunto de nuevos elementos que se identifican con el espacio de nombres mfp:. Los elementos añadidos contienen información relacionada con las características MobileFirst y MobileFirst Server.

Ejemplo de valores de MobileFirst añadidos al archivo config.xml

<?xml version='1.0'encoding='utf-8'?>
<widget id="..." xmlns:mfp="http://www.ibm.com/mobilefirst/cordova-plugin-mfp">
    <mfp:android>
        <mfp:sdkChecksum>3563350808</mfp:sdkChecksum>
        <mfp:appChecksum>0</mfp:appChecksum>
        <mfp:security>
            <mfp:testWebResourcesChecksum enabled="false" ignoreFileExtensions="png, jpg, jpeg, gif, mp4, mp3" />
        </mfp:security>
    </mfp:android>
    <mfp:windows>
        <mfp:sdkChecksum>3563350808</mfp:sdkChecksum>
       <mfp:windows10>
          <mfp:sdkChecksum>...</mfp:sdkChecksum>          
          <mfp:security>
             <mfp:testWebResourcesChecksum/>
          </mfp:security>
    </mfp:windows>
    <mfp:platformVersion>8.0.0.00-20151214-1255</mfp:platformVersion>
    <mfp:clientCustomInit enabled="false" />
    <mfp:server runtime="mfp" url="http://10.0.0.1:9080" />
    <mfp:directUpdateAuthenticityPublicKey>the-key</mfp:directUpdateAuthenticityPublicKey>
    <mfp:languagePreferences>en</mfp:languagePreferences>
</widget>
Elemento Descripción Configuración
widget Elemento raíz del documento config.xml. El elemento contiene dos atributos necesarios:
  • id: Nombre del paquete de aplicación que se especificó cuando se creó el proyecto Cordova. Si este valor se cambia manualmente después de se haya registrado la aplicación con MobileFirst Server, la aplicación se debe registrar de nuevo.
  • xmlns:mfp: Espacio de nombres XML del plugin MobileFirst.
mfp:platformVersion Necesario. Versión del producto con la que se desarrolló el la aplicación. Establecido de forma predeterminada. No se debe cambiar.
mfp:directUpdateAuthenticityPublicKey Opcional. Cuando se habilita la característica de autenticidad de Direct Update, el paquete Direct Update se firma digitalmente durante el despliegue. Después de que el cliente baje el paquete, se realiza una comprobación de seguridad para validar la autenticidad del paquete. El valor de serie es la clave pública que se utilizará para autenticar el archivo .zip de Direct Update. Configúrelo con el mandato mfpdev app config direct_update_authenticity_public_key key-value.
mfp:languagePreferences Opcional. Contiene una lista separada por comas de entornos locales para visualizar los mensajes del sistema. Configúrelo con el mandato mfpdev app config language_preferences key-value.
mfp:clientCustomInit Controla la forma en la que se llama al método WL.Client.init. De forma predeterminada, este valor se establece en false y se llama al método WL.Client.init de forma automática después de que se haya instalado el plugin MobileFirst. Establezca este valor en true para que el código del cliente controle de forma explícita al llamar a WL.Client.init. Editado manualmente. Los valores del atributo enabled son true o false.
mfp:server La información de conexión del servidor remoto predeterminado. La aplicación de cliente utiliza esta información para comunicarse con MobileFirst Server.
  • url: El valor de url especifica el protocolo, host y valores de puerto de MobileFirst Server que el cliente utilizará de forma predeterminada para conectarse al servidor.
  • runtime: El valor de tiempo de ejecución especifica el tiempo de ejecución de MobileFirst Server en el que se registró la aplicación. Para obtener más información sobre el tiempo de ejecución de MobileFirst, consulte la visión general de MobileFirst Server.
  • El valor del url de servidor se configura con el mandato mfpdev app config server.
  • El valor del tiempo de ejecución del servidor se establece con el mandato mfpdev app config runtime.
mfp:ios Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en la plataforma iOS.
  • mfp:appChecksum
  • mfp:sdkChecksum
  • mfp:security
mfp:android Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en la plataforma Android.
  • mfp:appChecksum
  • mfp:sdkChecksum
  • mfp:security
mfp:windows Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en la plataforma Windows.
  • mfp:appChecksum
  • mfp:windowsphone8
  • mfp:windows8
  • mfp:windows10
mfp:windows8 Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en las plataformas Windows 8.1.
  • mfp:sdkChecksum
  • mfp:security
mfp:windows10 Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en las plataformas Windows 10.
  • mfp:sdkChecksum
  • mfp:security
mfp:windowsphone8 Este elemento contiene toda la configuración de la aplicación de cliente relacionada con MobileFirst en las plataformas Windows 8.1.
  • mfp:sdkChecksum
  • mfp:security
mfp:appChecksum Este valor es la suma de comprobación de los recursos web de la aplicación. Se calcula al ejecutar mfpdev app webupdate. No es configurable por parte del usuario. El valor de la suma de comprobación se actualiza cuando se ejecuta el mandato mfpdev app webupdate. Para obtener más detalles sobre el mandato mfpdev app webupdate, escriba mfpdev help app webupdate en su ventana de mandatos.
mfp:sdkChecksum Este valor es la suma de comprobación de MobileFirst Operations Console SDK que se utiliza para identificar niveles de SDK de MobileFirst. No es configurable por parte del usuario. Este valor se establece de forma predeterminada.
mfp:security Este elemento contiene la configuración específica de la plataforma de la aplicación de cliente para la seguridad de MobileFirst. Contiene
  • mfp:testWebResourcesChecksum
mfp:testWebResourcesChecksum Controla si la aplicación verifica la integridad de sus recursos web cada vez que empieza a ejecutarse en el dispositivo móvil. Atributos:
  • enabled: Los valores válidos son true y false. Si este atributo se establece en true, la aplicación calcula la suma de comprobación de sus recursos web y compara esta suma de comprobación con un valor que se almacenó la primera vez que se ejecutó la aplicación.
  • ignoreFileExtensions: Cálculo de suma de comprobación que puede tardar unos segundos, dependiendo del tamaño de los recursos web. Para hacerlo más rápido, puede proporcionar una lista de extensiones de archivo que se pueden ignorar en este cálculo. Este valor se ignora cuando el valor del atributo enabled es false.
  • El atributo enabled se establece con el mandato mfpdev app config android_security_test_web_resources_checksum key-value.
  • El atributo ignoreFileExtensions se establece con el mandato mfpdev app config android_security_ignore_file_extensions value.

Edición de los valores de MobileFirst en el archivo config.xml

Utilice MobileFirst CLI para editar los valores anteriores ejecutando el mandato:

mfpdev app config

Guías de aprendizaje con las que continuar

Con el SDK de MobileFirst Ionic ahora integrado, podrá:

Inclusive terminology note: The Mobile First Platform team is making changes to support the IBM® initiative to replace racially biased and other discriminatory language in our code and content with more inclusive language. While IBM values the use of inclusive language, terms that are outside of IBM's direct influence are sometimes required for the sake of maintaining user understanding. As other industry leaders join IBM in embracing the use of inclusive language, IBM will continue to update the documentation to reflect those changes.
Last modified on February 27, 2020