How to: CoreMedia Headless Service installieren

In diesem Tutorial setzen wir den CoreMedia Headless Service auf und führen eine erste GraphQL Abfrage aus. Für die Installation benötigen wir ein laufendes CoreMedia 9 System und die aktuelle Headless Contribution bei GitHub.

Workspace installieren

Für unsere lokale Entwicklungsumgebung benötigen wir die gleichen Tools wie für den CoreMedia 9 Workspace: Java, Maven, GIT und Docker. Wir können den Service auch ohne Docker laufen lassen, aber mit Docker ist es gleich wesentlich einfacher. Ein CoreMedia Content Server, mit dem sich der Headless Service verbindet, sollte lokal oder remote bereit stehen. Nachdem wir die Headless Contribution bei GitHub ausgecheckt haben können wir gleich den Headless Service bauen. Falls ihr einen 404 Error bekommt benötigt ihr einen GitHub Account und die Freischaltung durch den CoreMedia Support.

> git clone [email protected]:coremedia-contributions/coremedia-headless-server-app.git
> cd coremedia-headless-server-app
> mvn clean install

...

[INFO] Successfully built coremedia/caas-server:1.0
[INFO] -----------------------------------------------------
[INFO] Reactor Summary:
[INFO] 
[INFO] coremedia-headless-server-app ... SUCCESS [  1.815 s]
[INFO] preview-client .................. SUCCESS [  5.004 s]
[INFO] headless-server-app ............. SUCCESS [  5.863 s]
[INFO] headless-server-app-docker .......SUCCESS [ 10.344 s]
[INFO] -----------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] -----------------------------------------------------

>

Im Verzeichnis headless-server-app-docker finden wir ein Shell-Skript zum bequemen starten des Docker Containers. Über die Umgebungsvariablen CONTENT_SERVER_HOST und CONTENT_SERVER_PORT können wir die Verbindung zu unserem CoreMedia Server konfigurieren. Der Docker Container hat den Namen caas-server. CAAS steht für Content as a Service. Ein Blick in das Container Logfile verrät uns ob der Headless Server läuft und eine Connection zum CoreMedia Server hat.

> export CONTENT_SERVER_HOST=content-management-server
> export CONTENT_SERVER_PORT=40180
> sh headless-server-app-docker/docker-run-server.sh

...

CaaS Server for 'content-management-server' running on http://localhost:8080/.

> docker logs caas-server

...

Tomcat started on port(s): 8080 (http) with context path ''
Started CaasServletInitializer in 14.291 seconds (JVM running for 15.574)
Initializing Spring DispatcherServlet 'dispatcherServlet'
Initializing Servlet 'dispatcherServlet'
Completed initialization in 23 ms

Content mit GraphQL strukturiert abfragen

Unser Headless Service ist nun bereit. Die Contribution hält zwei Tools bereit mit denen es auch GraphQL Neulingen leicht fällt die erste Abfrage zu erstellen:

Bei GraphiQL handelt es sich um eine einfache IDE für GraphQL. Sie läuft direkt im Browser und bietet einige coole Features wie Autocomplete, Prettify, Syntaxcheck und History.

http://localhost:8080/graphiql

Für unsere erste GraphQL Abfrage benötigen wir jetzt noch die Content-ID eines Artikel-Dokuments. Dazu suchen wir im CoreMedia Studio einen passenden Artikel und ermitteln die Content-ID aus dem System-Reiter.

Die GraphQL Abfrage für diesen Artikel sieht dann so aus:

query ArticleQuery {

  content {
    article(id: "1496") {
      title
      teaserTitle
      teaserText
      picture {
        name
        creationDate
        alt
        uriTemplate
      }
    }
  }
}

Als Ergebnis erhalten wir ein JSON Dokument:

{
  "data": {
    "content": {
      "article": {
        "title": "Chef Corp.'s Mission",
        "teaserTitle": "Chef Corp.'s Mission",
        "teaserText": "<div><p>Since 1999, Chef Corp. is committed to deliver expert solutions with the personal attention you deserve.</p></div>",
        "picture": {
          "name": "About Us Picture",
          "creationDate": "2019-07-01T22:18:04Z[GMT]",
          "alt": "Symbolic picture for About Chef Corp. section with a variety of employees",
          "uriTemplate": "/caas/v1/media/2182/data/8d1575d685076c85a3f2a532a1b9ffbb/{cropName}/{width}"
        }
      }
    }
CoreMedia Headless GraphiQL IDE

Damit ist die erste Abfrage geschafft. Mehr Informationen zu GraphQL findet ihr hier.

Medien-Objekte per REST abfragen

Genial am CAAS Service ist, das verlinkte Dokumente wie Bilder auch gleich mit ihren URLs eingebettet werden. Das Bild können wir mit folgender URL abrufen.

{cropName} = portrait_ratio1x1
{width} = 150 

http://localhost:8080/caas/v1/media/2182/data/1234567890/portrait_ratio1x1/115

Die API für Medien-Objekt können wir uns auch mit dem Swagger UI anschauen.

http://localhost:8080/swagger-ui.html
CoreMedia Headless Swagger UI

Fazit

In diesem Tutorial wurde gezeigt wie der CoreMedia Headless Service installiert wird und mit GraphQL eine einfache Abfrage ausgeführt wird.

Schreib einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.