Utforska GraphQL API:er explore-graphql-apis

Gå till Verktyg > Allmänt > GraphQL från AEM startskärm.

Tryck på Skapa i det övre högra hörnet i den resulterande dialogrutan och ange följande värden:

• Namn*: Min projektslutpunkt.
• Använd GraphQL-schema från … *: Mitt projekt

Tryck på Skapa för att spara slutpunkten.

GraphQL-slutpunkter som skapats baserat på en projektkonfiguration aktiverar bara frågor mot modeller som tillhör det projektet. I det här fallet kan de enda frågorna mot modellerna Person och Team användas.

Nu bör en GraphQL-slutpunkt vara aktiverad i din miljö.

Gå till Verktyg > Allmänt > GraphQL Query Editor från AEM startskärmen.

Kontrollera att slutpunkten är inställd på Min projektslutpunkt i det övre högra hörnet.

Klistra in följande fråga i huvudpanelen (ersätter kommentarlistan):

query allTeams {
  teamList {
    items {
      _path
      title
    }
  }
}

Tryck på knappen Spela upp på den översta menyn för att köra frågan. Du bör se resultatet av innehållsfragmenten från det föregående kapitlet:

Placera markören under texten title och ange CTRL+Space för att utlösa kodtips. Lägg till shortname och description i frågan.

Kör frågan igen genom att trycka på knappen Spela upp så ser du att resultatet innehåller de extra egenskaperna för shortname och description.

shortname är en enkel egenskap och description är ett textfält med flera rader och med GraphQL API kan vi välja olika format för resultat som html, markdown, json eller plaintext.

Uppdatera frågan så att den innehåller egenskapen teamMembers. Kom ihåg att detta är ett fragmentreferensfält till personmodellen. Personmodellens egenskaper kan returneras:

query allTeams {
    teamList {
        items {
            _path
            title
            shortName
            description {
                plaintext
            }
            teamMembers {
                fullName
                occupation
            }
        }
    }
}

JSON-svar:

{
    "data": {
        "teamList": {
        "items": [
            {
            "_path": "/content/dam/my-project/en/team-alpha",
            "title": "Team Alpha",
            "shortName": "team-alpha",
            "description": {
                "plaintext": "This is a description of Team Alpha!"
            },
            "teamMembers": [
                {
                "fullName": "John Doe",
                "occupation": [
                    "Artist",
                    "Influencer"
                ]
                },
                {
                "fullName": "Alison Smith",
                "occupation": [
                    "Photographer"
                ]
                }
              ]
        }
        ]
        }
    }
}

Möjligheten att fråga mot kapslade fragment är en kraftfull funktion i AEM GraphQL API. I det här enkla exemplet är kapslingen bara två nivåer djup. Det går dock att kapsla fragment ännu mer. Om det till exempel finns en Address-modell som är associerad med en Person kan data returneras från alla tre modellerna i en enda fråga.

Ange följande fråga i användargränssnittet för GraphiQL:

query personByName($name:String!){
  personList(
    filter:{
      fullName:{
        _expressions:[{
          value:$name
          _operator:EQUALS
        }]
      }
    }
  ){
    items{
      _path
      fullName
      occupation
    }
  }
}

Ovanstående fråga utför en sökning mot alla personfragment i systemet. Det tillagda filtret i början av frågan utför en jämförelse av fältet name och variabelsträngen $name.

Ange följande på panelen Frågevariabler:

{"name": "John Doe"}

Kör frågan. Endast Personer innehållsfragment returneras med värdet John Doe.

Det finns många andra alternativ för att filtrera och skapa komplexa frågor, se Lära dig att använda GraphQL med AEM - Exempelinnehåll och frågor.

Förbättra ovanstående fråga för att hämta profilbild

query personByName($name:String!){
  personList(
    filter:{
      fullName:{
        _expressions:[{
          value:$name
          _operator:EQUALS
        }]
      }
    }
  ){
    items{
      _path
      fullName
      occupation
      profilePicture{
        ... on ImageRef{
          _path
          _authorUrl
          _publishUrl
          height
          width

        }
      }
    }
  }
}

profilePicture är en innehållsreferens och förväntas vara en bild. Inbyggt ImageRef-objekt används därför. Detta gör att vi kan begära ytterligare data om bilden som ska refereras, som width och height.

Ange följande fråga i GraphiQL-redigeraren:

query personByPath($path: String!) {
    personByPath(_path: $path) {
        item {
        fullName
        occupation
        }
    }
}

Ange följande för frågevariabler:

{"path": "/content/dam/my-project/en/alison-smith"}

Kör frågan och observera att det enskilda resultatet returneras.

Ange följande fråga i GraphiQL IDE:

query allTeams {
    teamList {
        items {
            _path
            title
            shortName
            description {
                plaintext
            }
            teamMembers {
                fullName
                occupation
            }
        }
    }
}

Kontrollera att frågan fungerar.

Tryck sedan på Spara som och ange all-teams som frågenamn.

Frågan ska visas under Beständiga frågor i den vänstra listen.

Tryck sedan på ellipserna … bredvid den beständiga frågan och tryck på Kopiera URL för att kopiera sökvägen till Urklipp.

Öppna en ny flik och klistra in den kopierade sökvägen i webbläsaren:

https://$YOUR-AEMasCS-INSTANCEID$.adobeaemcloud.com/graphql/execute.json/my-project/all-teams

Det bör se ut ungefär som banan ovan. Du bör se att JSON-resultatet av frågan returneras.

Bryter ned URL:en ovan:

Återgå till GraphiQL IDE och använd plusknappen + för att behålla den NYA frågan

query personByName($name: String!) {
  personList(
    filter: {
      fullName:{
        _expressions: [{
          value: $name
          _operator:EQUALS
        }]
      }
    }){
    items {
      _path
      fullName
      occupation
      biographyText {
        json
      }
      profilePicture {
        ... on ImageRef {
          _path
          _authorUrl
          _publishUrl
          width
          height
        }
      }
    }
  }
}

Spara frågan som: person-by-name.

Du bör spara två beständiga frågor:

Gå till Verktyg > Allmänt > GraphQL från AEM startskärm.

Tryck på kryssrutan bredvid Min projektslutpunkt och tryck på Publish

Gå till Verktyg > Allmänt > GraphQL Query Editor från AEM startskärmen.

Tryck på all-teams-frågan från panelen Beständiga frågor och tryck sedan på Publish

Upprepa steget ovan för frågan person-by-name