Ramverk för sociala komponenter social-component-framework
Det sociala ramverket (SCF) förenklar processen att konfigurera, anpassa och utöka webbgruppskomponenter på både server- och klientsidan.
Fördelarna med ramverket:
- Funktionell: Enkel integrering direkt med liten eller ingen anpassning för 80 % av användningsfallen
- Skalbar: Enhetlig användning av HTML-attribut för CSS-format
- Utbyggbart: Komponentimplementeringen är objektorienterad och lätt utifrån affärslogik - enkel att lägga till inkrementell företagsinloggning på servern
- Flexibel: Enkla logikfria javascript-mallar som enkelt kan överlappas och anpassas
- Tillgänglig: HTTP-API:t stöder publicering från alla klienter, inklusive mobilappar
- Portable: Integrera/bädda in i alla webbsidor som bygger på valfri teknik
Utforska en författare eller publicera en instans med hjälp av den interaktiva Community Components Guide.
Översikt overview
I SCF består en komponent av en SocialComponent POJO, en hanterarmall för JS (för att återge komponenten) och CSS (för att formatera komponenten).
JS-mallar för handtag kan utöka JS-komponenterna för modell/vy för att hantera användarinteraktion med komponenten på klienten.
Om en komponent behöver stödja ändring av data kan implementeringen av API:t för SocialComponent skrivas för att ge stöd för redigering/sparande av data som liknar modell-/dataobjekt i traditionella webbprogram. Dessutom kan operationer (kontrollanter) och en åtgärdstjänst läggas till för att hantera operationsbegäranden, utföra affärslogik och anropa API:erna för modell-/dataobjekten.
SocialComponent-API:t kan utökas för att tillhandahålla data som krävs av en klient för ett visningslager eller en HTTP-klient.
Hur sidor återges för klienten how-pages-are-rendered-for-client
Komponentanpassning och tillägg component-customization-and-extension
Om du vill anpassa eller utöka komponenterna skriver du bara övertäckningar och tillägg till din /apps-katalog, vilket förenklar uppgraderingen till framtida versioner.
-
För skal
- Endast CSS behöver redigeras
-
For Look and Feel
- Ändra JS-mall och CSS
-
For Look, Feel och UX
- Ändra JS-mall, CSS och utöka/åsidosätta Javascript
-
Ändra den tillgängliga informationen för JS-mallen eller GETENS slutpunkt
- Utöka SocialComponent
-
Lägga till anpassad bearbetning under åtgärder
- Skriv en OperationExtension
-
Lägga till en ny anpassad åtgärd
- Skapa ett nytt Sling-poståtgärd
- Använd befintlig OperationServices efter behov
- Lägg till JavaScript-kod för att anropa åtgärden från klientsidan efter behov
Serverside Framework server-side-framework
Ramverket innehåller API:er för att komma åt funktioner på servern och stödja interaktion mellan klienten och servern.
Java API:er java-apis
Java-API:erna innehåller abstrakta klasser och gränssnitt som enkelt ärvs eller underklassas.
Huvudklasserna beskrivs i Anpassning på serversidan sida.
Besök Översikt över lagringsresursprovider om du vill veta mer om hur du arbetar med UGC.
HTTP-API http-api
HTTP-API:t har stöd för enkel anpassning och val av klientplattformar för PhoneGap-appar, inbyggda appar och andra integreringar och mashups. Dessutom gör HTTP API det möjligt för en community-webbplats att köras som en tjänst utan en klient, så att ramverkskomponenter kan integreras i alla webbsidor som bygger på valfri teknik.
HTTP API - GET-begäranden http-api-get-requests
För varje SocialComponent tillhandahåller ramverket en HTTP-baserad API-slutpunkt. Slutpunkten nås genom att en GET-begäran skickas till resursen med väljaren .social.json + tillägget. Med Sling lämnas begäran till DefaultSocialGetServlet
.
The DefaultSocialGetServlet
-
Skickar resursen (resourceType) till
SocialComponentFactoryManager
och tar emot en SocialComponentFactory som kan välja enSocialComponent
som representerar resursen. -
Anropar fabriken och tar emot en
SocialComponent
kan hantera resursen och begäran. -
Anropar
SocialComponent
, som bearbetar begäran och returnerar en JSON-representation av resultaten. -
Returnerar JSON-svaret till klienten.
GET Request
En standardserver för GET lyssnar på .social.json-begäranden som SocialComponent svarar på med anpassningsbar JSON.
HTTP API - POSTER http-api-post-requests
Förutom åtgärderna GET (Läs) definierar ramverket ett slutpunktsmönster som möjliggör andra åtgärder för en komponent, inklusive Skapa, Uppdatera och Ta bort. Dessa slutpunkter är HTTP-API:er som accepterar indata och svarar med antingen en HTTP-statuskod eller med ett JSON-svarsobjekt.
Det här ramverkets slutpunktsmönster gör CUD-åtgärder utökningsbara, återanvändbara och testbara.
POST Request
Det finns en Sling-POST:åtgärd för alla SocialComponent-åtgärder. Affärslogik och underhållskod för varje åtgärd omsluts av en OperationService som är tillgänglig via HTTP-API:t eller någon annanstans som en OSGi-tjänst. Det finns kopplingar med stöd för utökningar av anslutningsbara åtgärder för åtgärder före/efter.
Lagringsresursleverantör (SRP) storage-resource-provider-srp
Mer information om hur du hanterar UGC som lagras i community content store, se
- Översikt över lagringsresursprovider - Översikt över användning av introduktion och databas
- SRP och UGC Essentials - Verktygsmetoder och exempel för SRP API
- Åtkomst till UGC med SRP - Riktlinjer för kodning
Anpassningar på serversidan server-side-customizations
Besök Serveranpassning om du vill ha information om hur du anpassar affärslogiken och beteendet för en Communities-komponent på serversidan.
Hanterarfält - språk för JS-mallar handlebars-js-templating-language
En av de mer märkbara förändringarna i det nya ramverket är användningen av Handlebars JS mallating language (HBS), en populär öppen källkod-teknik för server-klientåtergivning.
HBS-skript är enkla, logikfria, kompilerade på både server och klient, är enkla att överlagra och anpassa och binds naturligt med klientens användargränssnitt eftersom HBS stöder rendering på klientsidan.
Ramverket innehåller flera Handtag som är användbara vid utveckling av sociala komponenter.
När Sling löser en GET-begäran på servern identifieras det skript som ska användas för att svara på begäran. Om skriptet är en HBS-mall (.hbs) delegerar Sling begäran till Handlebars Engine. Handlebars Engine hämtar sedan SocialComponent från lämplig SocialComponentFactory, skapar en kontext och återger HTML.
Ingen åtkomstbegränsning no-access-restriction
HBS-mallfiler (Handlebars) (.hbs) är detsamma som .jsp- och .html-mallfiler, förutom att de kan användas för återgivning både i klientwebbläsaren och på servern. En klientwebbläsare som begär en klientmall får därför en .hbs-fil från servern.
Detta kräver att alla HBS-mallar i sling-söksökvägen (alla HBS-filer under /libs/ eller /apps) kan hämtas av alla användare från författaren eller publiceringen.
HTTP-åtkomst till HBS-filer är inte förbjuden.
Lägg till eller inkludera en webbgruppskomponent add-or-include-a-communities-component
De flesta webbgruppskomponenter måste tillagd som en Sling-adresserbar resurs. Ett urval av Communities-komponenter kan ingår i en mall som en icke-befintlig resurs för dynamisk inkludering och anpassning av den plats där användargenererat innehåll (UGC) ska skrivas.
I båda fallen är komponentens nödvändiga klientbibliotek måste också finnas.
Lägg till en komponent
Att lägga till en komponent innebär att lägga till en instans av en resurs (komponent), till exempel när den dras från komponentens webbläsare (sidospark) till en sida i redigeringsläget för författare.
Resultatet är en underordnad JCR-nod under en par-nod, som är Sling-adresserbar.
Inkludera en komponent
Att ta med en komponent refererar till processen att lägga till en referens till en "non-existing" resource (ingen JCR-nod) i mallen, t.ex. med ett skriptspråk.
Från och med AEM 6.1 går det att redigera komponentens egenskaper i *design-läget när en komponent inkluderas dynamiskt i stället för att läggas till.
Endast ett fåtal av AEM Communities-komponenterna kan inkluderas dynamiskt. De är:
The Community Components Guide tillåter att komponenter som inte kan inkluderas växlas från att läggas till till.
När du använder handtag mallspråk inkluderas den icke-befintliga resursen med include helper genom att ange dess resourceType:
{{include this.id path="comments" resourceType="social/commons/components/hbs/comments"}}
Vid användning av JSP, ingår en resurs med taggen cq:include:
<cq:include path="votes"
resourceType="social/tally/components/voting" />
Handtag handlebars-helpers
Se Hjälpmedel för SCF-handtag om du vill ha en lista och en beskrivning av anpassade hjälpredor som finns i SCF.
Klientbaserat ramverk client-side-framework
Model-View Javascript Framework model-view-javascript-framework
Ramverket innehåller en förlängning av Backbone.js, ett modellbaserat JavaScript-ramverk som underlättar utvecklingen av avancerade, interaktiva komponenter. Den objektorienterade naturen har stöd för ett utbyggbart/återanvändbart ramverk. Kommunikationen mellan klient och server förenklas med HTTP API.
Ramverket använder mallar för serversidans handtag för att återge komponenterna för klienten. Modellerna baseras på JSON-svar som genereras av HTTP API. Vyerna binder sig till HTML som genereras av Handlebars-mallarna och ger interaktivitet.
CSS-konventioner css-conventions
Följande är rekommenderade konventioner för att definiera och använda CSS-klasser:
- Använd CSS-klassväljarnamn med tydligt namn och undvik generiska namn som heading, image osv.
- Definiera specifika klassväljarformat så att CSS-formatmallarna fungerar bra med andra element och format på sidan. Till exempel:
.social-forum .topic-list .li { color: blue; }
- Håll CSS-klasser för formatering åtskilda från CSS-klasser för UX som drivs av JavaScript
Anpassningar på klientsidan client-side-customizations
Om du vill anpassa utseendet och beteendet för en Communities-komponent på klientsidan, se Anpassningar på klientsidan, som innehåller information om
Grundläggande funktioner och komponenter feature-and-component-essentials
Viktig information för utvecklare finns i Grundläggande funktioner och komponenter -avsnitt.
Ytterligare utvecklarinformation finns i Riktlinjer för kodning -avsnitt.
Felsökning troubleshooting
Vanliga problem och kända problem beskrivs i Felsökning -avsnitt.