建立 API 要求 - Headless 設定 accessing-delivering-content-fragments

了解如何使用 GraphQL API Headless 傳遞內容片段,以及如何使用 AEM Assets REST API 管理內容片段。

什麼是 GraphQL 和 Assets REST API? what-are-the-apis

現在您已經建立一些內容片段,您可以使用 AEM 的 API Headless 傳遞內容片段。

本指南的其餘部分著重在 GraphQL 存取和內容片段傳遞。

啟用 GraphQL 端點 enable-graphql-endpoint

必須建立 GraphQL 端點,才能使用 GraphQL API。

  1. 導覽至​ 工具一般,然後選取 GraphQL

  2. 選擇 建立

  3. 建立新的 GraphQL 端點 ​對話框隨即開啟。您可以在這裡指定:

    • 名稱:端點名稱,您可以輸入任何文字。
    • 使用由 ​提供的GraphQL結構描述:使用下拉式清單來選取必要的設定。
  4. 使用​ 建立 ​確認。

  5. 主控台會根據之前建立的設定顯示​ 路徑。此路徑用於執行 GraphQL 查詢。

    code language-none
    /content/cq:graphql/<configuration-name>/endpoint
    

更多有關啟用 GraphQL 端點的詳細資訊位於此處

使用 GraphQL 和 GraphiQL 查詢內容

資訊架構師會為他們的管道端點設計查詢,以便傳遞內容。只需要為每個模型的每個端點考慮一次這些查詢。出於本快速入門指南的目的,您只需要建立一個。

GraphiQL 是包含在您 AEM 環境中的 IDE,在設定您的端點後,即可存取/看見它。

  1. 登入 AEM as a Cloud Service 並存取 GraphiQL 介面:

    您可以從以下任一方式存取查詢編輯器:

    • 工具 > 一般 > GraphQL 查詢編輯器
    • 直接;例如 http://localhost:4502/aem/graphiql.html
  2. GraphiQL IDE 是 GraphQL 的瀏覽器內查詢編輯器。您可以用來建立查詢以擷取內容片段,以將其作為 JSON 以 Headless 方式傳遞。

    • 右上角的下拉選單可讓您選取端點。
    • 最左側的面板列出持續性查詢 (如果可用)
    • 中間偏左的面板可讓您建置查詢。
    • 中間偏右面板顯示結果。
    • 查詢編輯器具有程式碼完成和快速鍵功能,可輕鬆執行查詢。

    GraphiQL 編輯器

  3. 假設您建立的模型名為 person,其中包含欄位 firstNamelastNameposition,您可以建立一個簡單的查詢來擷取內容片段的內容。

    code language-text
    query
    {
      personList {
        items {
          _path
          firstName
          lastName
          position
        }
      }
    }
    
  4. 在左側面板中輸入查詢。
    GraphiQL 查詢

  5. 按一下​ 執行查詢 ​按鈕或使用 Ctrl-Enter 快速鍵,右側面板將以 JSON 格式顯示結果。
    GraphiQL 結果

  6. 在頁面的右上角,按一下「文件」連結可顯示內文中文件,以建立適合您自己模型的查詢。
    GraphiQL 文件

GraphQL 支援結構化查詢,這些查詢不僅可以針對特定資料集或個別資料物件,還可以傳遞物件的特定元素、巢狀結果、支援查詢變數等等。

GraphQL 可以避免反覆 API 要求和過度傳遞,而是允許大量傳遞呈現作業所需的內容,作為對單一 API 查詢的回應。產生的 JSON 可用於將資料傳遞到其他網站或應用程式。

後續步驟 next-steps

就是這樣!您現在對 AEM Headless 內容管理有基本的了解。還有更多資源可供您深入研究以全面了解可用的功能。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab