在Edge Delivery Services上設定AEM Edge功能

登入Cloud Manager，並使用Edge Delivery Services附加元件開啟您的程式。 在計畫總覽上，確認顯示​ Edge Delivery ​標籤。

在​ Edge Delivery ​標籤上，完成​Edge Delivery待辦事項清單。 主要步驟包括：

1. 新增Edge Delivery網站：

   • 網站名稱： Frescopa
   • Edge Delivery來源： https://main--frescopa--sachinmali.aem.live/

   格式為https://<branch>--<site-name>--<organization-name>.aem.live/，其中<branch>、<site-name>及<organization-name>分別為Edge Delivery Services網站專案的分支、網站名稱及組織名稱。

   理想情況下，您可以嘗試設定Edge Delivery Services網站專案的dev分支。不過，請參閱下列示範網站的熒幕擷圖。

   

2. 新增網域：

   • 網域名稱： myfrescopa.enablementadobe.com

   您必須設定好自訂網域名稱，才能部署AEM Edge Functions專案，即使您嘗試在對應至Edge Delivery Services網站專案之開發分支的開發網站上進行部署亦然。

3. 新增SSL憑證：

   • 憑證型別：客戶管理(OV/EV)
   • 憑證名稱： enablementadobe.com
   • 憑證：簽署的憑證檔案內容介於-----BEGIN CERTIFICATE-----到-----END CERTIFICATE-----之間
   • 私密金鑰：私密金鑰檔案內容介於-----BEGIN PRIVATE KEY-----和-----END PRIVATE KEY-----之間
   • 憑證鏈結：憑證鏈結檔案內容介於-----BEGIN CERTIFICATE-----和-----END CERTIFICATE-----之間

   

   您也可以使用Adobe Managed (DV)憑證，基於教學課程目的，我們以客戶管理的(OV/EV)憑證為例。

4. 在您的DNS主機服務中新增myfrescopa.enablementadobe.com的DNS記錄。

5. 將網域 myfrescopa.enablementadobe.com對應至Adobe管理的CDN。

   

確認網站出現在Edge Delivery Sites表格中。 示範Frescopa網站可在https://myfrescopa.enablementadobe.com/取得。

Cloud Manager中的

導覽至GitHub上的aem-edge-functions-boilerplate。

在右上角，選取​使用此範本 > 建立新的存放庫。

提供存放庫名稱（例如，frescopa-edge-functions）、新增說明、將可見度設定為​私人，並選取​建立存放庫。

package.json包含專案相依性。 請注意@fastly/js-compute相依性。 如需詳細資訊，請參閱運算平台🔗上的JavaScript。

src/index.js是函式進入點，並包含專案的主要邏輯。 它使用Fastly Compute的addEventListener("fetch", ...)模式。 所有傳入的請求都會流經handleRequest函式，您可在此加入路由比對邏輯。 例如，下列程式碼來自範本：

// src/index.js
addEventListener("fetch", (event) => event.respondWith(handleRequest(event)));

async function handleRequest(event) {
    const req = event.request;
    const url = new URL(req.url);

    let finalResponse;

    try {
        // Route matching logic
        if (url.pathname === "/" && req.method === "GET") {
            finalResponse = new Response("Hello World from the edge!", { status: 200 });
        } else if (url.pathname === "/hello-world" && req.method === "GET") {
            finalResponse = new Response("Hello World from the edge!", { status: 200 });
        } else if (url.pathname === "/weather" && req.method === "GET") {
            finalResponse = await weatherHandler(req, event.client);
        } else {
            finalResponse = response.notFound();
        }
    } catch (err) {
        finalResponse = new Response("Internal Server Error", { status: 500 });
    }

    return finalResponse;
}

單一AEM Edge函式可以處理handleRequest中if陳述式的多個路由。

fastly.toml設定本機開發伺服器。 如需詳細資訊，請參閱Fastly.toml參考。

config/包含AEM Edge功能服務和CDN路由規則的設定檔。 透過Cloud Manager中的Edge Delivery設定管道部署這些檔案。 步驟6涵蓋該程式。

Adobe存放庫：在Cloud Manager中為您的程式建立新的存放庫。

私人存放庫：將您現有的GitHub存放庫連結至Cloud Manager。

在Cloud Manager中，開啟​ 存放庫 ​並選取​新增存放庫。

在​ 新增存放庫 ​對話方塊中，選取​私人存放庫，然後提供存放庫名稱、URL和型別。 選取「儲存」。

完成​ 私人存放庫所有權驗證 ​對話方塊中的步驟。

1. 授予Cloud Manager存放庫的存取權：

   

2. 將驗證密碼儲存在AEM Edge函式專案存放庫中：

   

在計畫總覽頁面上，開啟​ Edge Delivery ​標籤。 在​ 管道 ​底下，選取​新增Edge Delivery管道。

在​ 新增Edge Delivery管道 ​對話方塊中，提供名稱並選取​繼續。

在​ Source程式碼 ​步驟中，選取您新增的私人存放庫、main分支和/config作為程式碼位置。 選取「儲存」。

選取管道名稱旁的​…，然後選取​執行，以執行管道。