Social Component Framework social-component-framework

Das Social Component Framework (SCF) vereinfacht die Konfiguration, Anpassung und Erweiterung von Communities-Komponenten auf Server- und Client-Seite.

Vorteile des Frameworks:

Durchsuchen einer Autoren- oder Veröffentlichungsinstanz mithilfe des interaktiven Handbuch zu Community-Komponenten.

Übersicht overview

In SCF besteht eine Komponente aus einem SocialComponent POJO, einer Handlebars-JS-Vorlage (zum Rendern der Komponente) und CSS (zum Formatieren der Komponente).

Eine Handlebars-JS-Vorlage kann die JS-Komponenten model/view erweitern, um die Benutzerinteraktion mit der Komponente auf dem Client zu handhaben.

Wenn eine Komponente die Änderung von Daten unterstützen muss, kann die Implementierung der SocialComponent-API geschrieben werden, um die Bearbeitung/Speicherung von Daten ähnlich den Modell-/Datenobjekten in herkömmlichen Webanwendungen zu unterstützen. Darüber hinaus können Vorgänge (Controller) und ein Vorgangsdienst hinzugefügt werden, um Vorgangsanfragen zu verarbeiten, Geschäftslogik auszuführen und die APIs für die Modell-/Datenobjekte aufzurufen.

Die SocialComponent-API kann erweitert werden, um Daten bereitzustellen, die von einem Client für eine Ansichtsebene oder einen HTTP-Client benötigt werden.

Darstellung von Seiten für Client how-pages-are-rendered-for-client

Komponentenanpassung und -erweiterung component-customization-and-extension

Um die Komponenten anzupassen oder zu erweitern, schreiben Sie nur die Überlagerungen und Erweiterungen in Ihr /apps-Verzeichnis, was die Aktualisierung auf zukünftige Versionen vereinfacht.

Server-seitiges Framework server-side-framework

Das Framework stellt APIs für den Zugriff auf Funktionen auf dem Server und die Interaktion zwischen Client und Server bereit.

Java™-APIs java-apis

Die Java™-APIs bieten abstrakte Klassen und Schnittstellen, die einfach geerbt oder unterteilt werden können.

Die Hauptklassen werden im Abschnitt Serverseitige Anpassung Seite.

Besuch Übersicht über den Speicheranbieter , um mehr über die Arbeit mit UGC zu erfahren.

HTTP-API http-api

Die HTTP-API unterstützt die einfache Anpassung und Auswahl von Client-Plattformen für PhoneGap-Apps, native Apps und andere Integrationen und Mashups. Darüber hinaus ermöglicht die HTTP-API es einer Community-Site, als Dienst ohne Client ausgeführt zu werden, sodass Framework-Komponenten in jede auf einer beliebigen Technologie aufbauende Webseite integriert werden können.

HTTP-API - GET-Anfragen http-api-get-requests

Für jede SocialComponent stellt das Framework einen HTTP-basierten API-Endpunkt bereit. Der Zugriff auf den Endpunkt erfolgt durch Senden einer GET-Anfrage an die Ressource mit der Selektor + Erweiterung ".social.json". Mit Sling wird die Anfrage an die DefaultSocialGetServlet.

DefaultSocialGetServlet

GET Request

Ein standardmäßiges GET-Servlet überwacht .social.json -Anfragen, auf die die SocialComponent mit anpassbarer JSON antwortet.

HTTP-API - POST-Anfragen http-api-post-requests

Zusätzlich zu den GET (Lesen)-Vorgängen definiert das Framework ein Endpunktmuster, um andere Vorgänge für eine Komponente zu aktivieren, darunter Erstellen, Aktualisieren und Löschen. Diese Endpunkte sind HTTP-APIs, die Eingaben akzeptieren und entweder mit einem HTTP-Statuscode oder mit einem JSON-Antwortobjekt antworten.

Dieses Framework-Endpunktmuster macht CUD-Vorgänge erweiterbar, wiederverwendbar und prüfbar.

POST Request

Für jeden Vorgang "SocialComponent"gibt es einen Sling-Vorgang POST:operation. Die Geschäftslogik und der Wartungscode für jeden Vorgang sind in einen OperationService eingeschlossen, auf den über die HTTP-API oder von einem anderen Ort aus als OSGi-Dienst zugegriffen werden kann. Erweiterungen von Plug-ins für Vor-/Nach-Aktionen werden über Erweiterungen von Erweiterungen bereitgestellt.

Storage Resource Provider (SRP) storage-resource-provider-srp

Informationen zum Umgang mit benutzergenerierten Inhalten, die im Community-Inhaltsspeicher, siehe:

Serverseitige Anpassungen server-side-customizations

Besuch Serverseitige Anpassungen für Informationen zum Anpassen der Geschäftslogik und des Verhaltens einer Communities-Komponente auf der Server-Seite.

Handlebars JS-Vorlagensprache handlebars-js-templating-language

Eine der auffälligsten Änderungen im neuen Framework ist die Verwendung der Handlebars JS (HBS) Vorlagensprache, eine beliebte Open-Source-Technologie für Server-Client-Rendering.

HBS-Skripte sind einfach, logiklos, auf dem Server und Client kompiliert, einfach zu überlagern und anzupassen und sind natürlich mit der Client-UX verbunden, da HBS clientseitiges Rendering unterstützt.

Das Framework bietet mehrere Handlebars-Helfer die bei der Entwicklung von SocialComponents nützlich sind.

Wenn Sling auf dem Server eine GET-Anforderung auflöst, identifiziert er das Skript, das für die Antwort auf die Anfrage verwendet wird. Wenn das Skript eine HBS-Vorlage (.hbs) ist, delegiert Sling die Anforderung an die Handlebars-Engine. Die Handlebars-Engine ruft dann die SocialComponent von der entsprechenden SocialComponentFactory ab, erstellt einen Kontext und rendert die HTML.

Keine Zugriffsbeschränkung no-access-restriction

Handlebars (HBS)-Vorlagendateien (.hbs) entsprechen .jsp- und .html-Vorlagendateien, können jedoch sowohl im Client-Browser als auch auf dem Server für die Wiedergabe verwendet werden. Daher erhält ein Client-Browser, der eine clientseitige Vorlage anfordert, eine .hbs-Datei vom Server.

Dazu müssen alle HBS-Vorlagen im Sling-Suchpfad (alle .hbs-Dateien unter /libs/ oder /apps) von jedem Benutzer aus der Autoren- oder Veröffentlichungsinstanz abgerufen werden.

HTTP-Zugriff auf .hbs-Dateien ist möglicherweise nicht verboten.

Hinzufügen oder Einschließen einer Communities-Komponente add-or-include-a-communities-component

Die meisten Communities-Komponenten müssen hinzugefügt als adressierbare Sling-Ressource. Einige der Communities-Komponenten können enthalten in einer Vorlage als nicht vorhandene Ressource enthalten, um eine dynamische Einbindung und Anpassung des Speicherorts zu ermöglichen, an dem benutzergenerierte Inhalte geschrieben werden (UGC).

In beiden Fällen wird die erforderliche Client-Bibliotheken auch vorhanden sein.

Hinzufügen einer Komponente

Das Hinzufügen einer Komponente bezieht sich auf den Prozess des Hinzufügens einer Instanz einer Ressource (Komponente), z. B. wenn diese aus dem Komponenten-Browser (Sidekick) auf eine Seite im Bearbeitungsmodus für Autoren gezogen wird.

Das Ergebnis ist ein untergeordneter JCR-Knoten unter einem par -Knoten, der Sling-adressierbar ist.

Komponente einschließen

Das Einschließen einer Komponente bezieht sich auf den Prozess des Hinzufügens eines Verweises zu einer "nicht vorhandene"Ressource (kein JCR-Knoten) innerhalb der Vorlage, z. B. mithilfe einer Skriptsprache.

Ab Adobe Experience Manager (AEM) 6.1 ist es möglich, die Komponenteneigenschaften im Autor zu bearbeiten, wenn eine Komponente dynamisch eingeschlossen statt hinzugefügt wird Design -Modus.

Es können nur einige ausgewählte AEM Communities-Komponenten dynamisch eingeschlossen werden. Sie sind:

Die Handbuch zu Community-Komponenten ermöglicht, dass integrative Komponenten von der Hinzufügung zur Einbindung umgeschaltet werden.

Bei Verwendung von Handlebars Vorlagensprache verwenden, wird die nicht vorhandene Ressource mit der include helper durch Angabe seines resourceType:

{{include this.id path="comments" resourceType="social/commons/components/hbs/comments"}}

Bei Verwendung von JSP, wird eine Ressource mithilfe des Tags eingeschlossen. cq:include:

<cq:include path="votes"
 resourceType="social/tally/components/voting" />

Handlebars Helpers handlebars-helpers

Siehe SCF Handlebars Helpers für eine Liste und Beschreibung der in SCF verfügbaren benutzerdefinierten Helfer.

Client-seitiges Framework client-side-framework

Modell-View JavaScript Framework model-view-javascript-framework

Das Framework umfasst eine Erweiterung von Backbone.js, ein JavaScript-Framework zur Modellansicht, um die Entwicklung von komplexen, interaktiven Komponenten zu erleichtern. Die objektorientierte Natur unterstützt ein erweiterbares/wiederverwendbares Framework. Die Kommunikation zwischen Client und Server wird mit der HTTP-API vereinfacht.

Das Framework verwendet serverseitige Handlebars-Vorlagen, um die Komponenten für den Client zu rendern. Die Modelle basieren auf den von der HTTP-API generierten JSON-Antworten. Die Ansichten binden sich an HTML, die von den Handlebars-Vorlagen generiert wurde, und bieten Interaktivität.

CSS-Konventionen css-conventions

Die folgenden Konventionen werden zum Definieren und Verwenden von CSS-Klassen empfohlen:

Clientseitige Anpassungen client-side-customizations

Informationen zum Anpassen des Erscheinungsbilds und Verhaltens einer Communities-Komponente auf Client-Seite finden Sie unter Clientseitige Anpassungen, der Informationen zu enthält:

Funktionen und Komponentengrundlagen feature-and-component-essentials

Wesentliche Informationen für Entwickler werden im Abschnitt Funktionen und Komponentengrundlagen Abschnitt.

Weitere Entwicklerinformationen finden Sie im Abschnitt Kodierungsrichtlinien Abschnitt.

Fehlerbehebung troubleshooting

Die allgemeinen Bedenken und bekannten Probleme werden im Abschnitt Fehlerbehebung Abschnitt.