Är din hybridapp redo för AEM Mobile? is-your-hybrid-app-ready-for-aem-mobile

CAUTION
AEM 6.4 har nått slutet på den utökade supporten och denna dokumentation är inte längre uppdaterad. Mer information finns i teknisk supportperiod. Hitta de versioner som stöds här.
NOTE
Adobe rekommenderar att du använder SPA Editor för projekt som kräver ramverksbaserad klientåtergivning för en sida (t.ex. Reagera). Läs mer.

Så du har importerat din Hybrid PhoneGap- eller Cordova-app till AEM, vad gör du nu? Du kanske vill lägga till innehåll som är redigerbart i appen. För att kunna utföra den här uppgiften behöver du en allmän förståelse för strukturen i en AEM. En app i AEM delas vanligtvis in i två delar. Gränssnittet och innehållet. "Skal" består av de statiska delarna av appen; som konfigurationsfilerna för PhoneGap, appramverket och navigeringskontrollerna. Innehållet i det importerade arkivet lagras som en del av skalet. I det här dokumentet är gränssnittet allt icke-AEM innehåll i din Hybrid PhoneGap-app som skapats av apputvecklaren.

Innehåll avser de komponenter, mallar och redigerade sidor som skapas i AEM som skapats av AEM. Innehåll kategoriseras antingen som utvecklarinnehåll eller som redigerat innehåll. Komponenter, designer och sidmallar betraktas som designinnehåll eftersom de har skapats av en utvecklare. författarinnehåll är sidor som har byggts med hjälp av komponenter och mallar. Dessa utförs vanligtvis av en designer eller en marknadsförare.

Om du vill lägga till skapade AEM-sidor i Hybrid-appen måste det finnas en samordning mellan apputvecklaren och AEM. Var som helst i appen där du vill lägga till redigerat innehåll måste apputvecklaren ordna dessa sidor i en struktur som kan överlappas av AEM. Apputvecklaren måste kunna ge den AEM utvecklaren sökvägarna till den plats där det AEM innehållet ska läggas till och sedan tillhandahålla en platshållarsida i Hybrid-appen som ska ersättas efter att den AEM utvecklaren har skapat sidinnehållet.

För att göra förklaringen enklare att följa använder vi AEM Marketing Cloud: AEM Mobile Hybrid Reference för att förklara koncepten. Hybrid Reference-programmet består av en välkomstsida med en sidomeny.

chlimage_1-76

I det här exemplet ska vi skapa programmets välkomstsida. Ta en titt på källan https://github.com/Adobe-Marketing-Cloud-Apps/aem-mobile-hybrid-reference/blob/master/hybrid-app/www/js/app.js#L75. Vi ser att apputvecklaren har definierat en välkomstsida och tillhandahållit en mall för sidan som återges av appen. Det är här apputvecklaren och AEM måste samordna. Sökvägen till välkomstsidmallen i Hybrid Reference App definieras som ''content/mobileapps/hybrid-reference-app/en/welcome.template.html''. Den här sökvägen är mycket viktig eftersom AEM utvecklare skapar sin välkomstsida i AEM med samma sökväg.

chlimage_1-77

Det är viktigt att hybridappen och det AEM innehållet använder samma sökväg eftersom vi förlitar oss på möjligheten att täcka över innehåll med hjälp av Content Sync för att lägga till nya sidor i Hybrid-appen. När Hybrid-appen importeras till AEM som en del av importprocessen ställs Content Sync-konfigurationer in.

chlimage_1-78

När du 'laddar ned källa' från appkontrollpanelen körs dessa ContentSync-skript för att samla ihop ett arkiv av din Hybrid-app.

chlimage_1-79

ContentSync hämtar först"skal" för appen, där allt apputvecklat innehåll från Hybrid-appen lagras och sedan hämtas det i appens"innehåll". Om det nu finns sidor i gränssnittet som har samma sökväg som i content kommer sidorna under shell att ersättas med sidorna under content. Det innebär att om vi skapar en sida i AEM som har samma sökväg som content/mobileapps/hybrid-reference-app/en/welcome.template.html när ContentSync körs i Hybrid Reference App-exemplet, kommer den att täcka över sidan som ingick i Hybrid Reference-appen med det som finns i AEM på den platsen. Övertäckningen hanteras av ContentSync så att uppdateringarna av appen med AEM innehåll ser sömlösa ut för alla som använder appen och inte behöver bygga om appen. När du kör programmet visas välkomstsidan som följer:

chlimage_1-80

recommendation-more-help
547b817b-14b5-4d82-aa0f-a64750e0e592