La tua app ibrida è pronta per AEM Mobile?

NOTA

L’Adobe consiglia di utilizzare l’Editor SPA per i progetti che richiedono il rendering lato client basato su framework di applicazione a pagina singola (ad esempio, React). Ulteriori informazioni.

Quindi hai importato la tua app Hybrid PhoneGap o Cordova nell'AEM, e ora? Probabilmente vorrai aggiungere all’app contenuti che possano essere creati dall’autore. Per eseguire questa attività è necessaria una comprensione generale della struttura di un’app AEM. Un’app nell’AEM è comunemente divisa in due parti. La "shell" e il "contenuto". La "shell" comprende le parti statiche dell’app, ad esempio i file di configurazione PhoneGap, il framework dell’app e i controlli di navigazione. Il contenuto dell'archivio importato viene memorizzato come parte della shell. Nel contesto di questo documento, la shell è tutto il contenuto creato non dall’AEM dell’app Hybrid PhoneGap creata dallo sviluppatore dell’app.

Il contenuto si riferisce ai componenti, ai modelli e alle pagine create da AEM e create da AEM Developer. Il contenuto è classificato come contenuto per sviluppatori o come contenuto creato. I componenti, le progettazioni e i modelli di pagina sono considerati contenuti per lo sviluppo, in quanto sono generati da uno sviluppatore. i contenuti dell’autore sono pagine che sono state create utilizzando i componenti e i modelli. Queste operazioni vengono in genere eseguite da un designer o da un addetto marketing.

L’aggiunta di pagine AEM create all’app ibrida richiede il coordinamento tra lo sviluppatore dell’app e lo sviluppatore dell’AEM. In qualsiasi punto dell’app in cui desideri aggiungere contenuti creati, lo sviluppatore dell’app deve organizzare queste pagine in una struttura che possa essere sovrapposta nell’AEM. Lo sviluppatore dell’app deve essere in grado di fornire allo sviluppatore dell’AEM i percorsi in cui deve essere aggiunto il contenuto creato dall’AEM e quindi fornire nell’app ibrida una pagina segnaposto che verrà sostituita dopo che lo sviluppatore dell’AEM avrà creato il contenuto della pagina.

Per rendere la spiegazione più facile da seguire, per spiegare i concetti utilizzeremo il Marketing Cloud AEM: AEM Mobile Hybrid Reference. L’app Hybrid Reference è costituita da una pagina di benvenuto con un menu laterale.

chlimage_1-76

In questo esempio verrà creata la pagina di benvenuto dell’applicazione. Dai un’occhiata alla sorgente https://github.com/Adobe-Marketing-Cloud-Apps/aem-mobile-hybrid-reference/blob/master/hybrid-app/www/js/app.js#L75. Vediamo che lo sviluppatore di app ha definito una pagina di benvenuto e ha fornito un modello per la pagina di cui viene eseguito il rendering dall’app. È qui che lo sviluppatore di app e lo sviluppatore di AEM devono coordinarsi. Il percorso del modello della pagina di benvenuto nell’app di riferimento ibrida è definito come "content/mobileapps/hybrid-reference-app/en/welcome.template.html". Questo percorso è estremamente importante perché lo sviluppatore AEM creerà la pagina di benvenuto nell’archivio AEM utilizzando lo stesso percorso.

chlimage_1-77

È importante che l’app ibrida e i contenuti creati dall’AEM utilizzino lo stesso percorso, perché per aggiungere nuove pagine all’app ibrida ci affidiamo alla possibilità di sovrapporre i contenuti utilizzando Sincronizzazione contenuti. Quando l’app ibrida viene importata in AEM come parte del processo di importazione, vengono impostate le configurazioni di Sincronizzazione contenuto.

chlimage_1-78

Quando "Scarica origine" dal dashboard dell’app, questi script ContentSync vengono eseguiti per assemblare un archivio dell’app ibrida.

chlimage_1-79

ContentSync prima richiama la "shell" dell’app, dove vengono memorizzati tutti i contenuti sviluppati dall’app ibrida, e poi richiama il "contenuto" dell’app. Ora, se ci sono pagine nella "shell" che hanno lo stesso percorso di "content", le pagine nella "shell" saranno (sostituite) dalle pagine in "content". In altre parole, nell’esempio dell’app di riferimento ibrida se creiamo in AEM una pagina con lo stesso percorso di "content/mobileapps/hybrid-reference-app/en/welcome.template.html" quando viene eseguito ContentSync, questa si sovrapporrà alla pagina che faceva parte dell’app di riferimento ibrido con tutto ciò che si trova nell’AEM in quella posizione. La sovrapposizione è gestita da ContentSync in modo che per qualcuno che sta utilizzando l'app gli aggiornamenti all'app con contenuti creati da AEM saranno senza soluzione di continuità e non richiederanno una ricostruzione dell'app. Di conseguenza, quando esegui l’app, la pagina di benvenuto viene visualizzata come segue:

chlimage_1-80

In questa pagina