Documentação AEM Tutoriais do AEM as a Cloud Service

Configurar as funções do AEM Edge no Edge Delivery Services

Última atualização: 25 de junho de 2026

Aplica-se a:
Experience Manager as a Cloud Service

Criado para:

Intermediate
Admin
Developer

IMPORTANT

O AEM Edge Functions está atualmente na versão beta. Os recursos e a documentação podem mudar. Para receber comentários, contate aemcs-edgecompute-feedback@adobe.com.

Saiba como configurar o AEM Edge Functions em um site do Edge Delivery Services.

Este tutorial aborda a integração do site do Edge Delivery no Cloud Manager, a instalação da CLI, a configuração do projeto a partir do modelo padrão, a configuração da CDN e a implantação de um endpoint em funcionamento.

Este tutorial usa o Projeto do site Frescopa como site de demonstração. Você pode seguir as mesmas etapas com seu próprio site do Edge Delivery Services.

O que você vai criar

As Funções do AEM Edge são módulos do JavaScript executados no Adobe CDN na borda, não em sua origem no Edge Delivery. Você implanta uma AEM Edge Function chamada my-edge-function com duas rotas:

/hello-world retorna uma saudação da borda
/weather detecta a localização do visitante na borda, chama a API Open-Meteo e retorna a temperatura atual para sua cidade

Durante o desenvolvimento, você testa a função Edge do AEM localmente com o servidor dev. Em seguida, implante o edgeFunctions.yaml e o cdn.yaml por meio do pipeline de configuração do Edge Delivery, envie a Função do Edge do AEM (módulo do JavaScript) para o CDN da Adobe e verifique os dois pontos de extremidade no domínio do site (por exemplo, https://myfrescopa.enablementadobe.com/hello-world).

As etapas de alto nível:

Integrar seu site do Edge Delivery ao Cloud Manager
Instalar o plug-in Adobe CLI e AEM Edge Functions
Configurar as funções do AEM Edge no Edge Delivery Services
Criar o projeto do AEM Edge Functions a partir do modelo padronizado
Clonar, revisar e executar o projeto do AEM Edge Functions localmente
Revisar, gerenciar e implantar a configuração da CDN
Criar e implantar as Funções do AEM Edge na CDN da Adobe
Verifique se o endpoint está funcionando

Pré-requisitos

Verifique se os itens a seguir estão em vigor antes de iniciar.

Node.js e npm instalados localmente
Uma conta GitHub para criar um projeto a partir do modelo padronizado
Um complemento do Edge Delivery Services para o seu programa Cloud Manager
Função de Gerente de implantação no Cloud Manager
O Projeto do site Frescopa ou seu próprio projeto do site Edge Delivery

NOTE

O Edge Delivery Services oferece suporte a até três funções do AEM Edge por programa, destinadas a oferecer suporte a ramificações de desenvolvimento, preparo e produção de seu(s) site(s).

Etapa 1: integrar seu site do Edge Delivery ao Cloud Manager

Antes de configurar o AEM Edge Functions, integre seu site do Edge Delivery no Cloud Manager. Essa etapa usa somente o Cloud Manager e não requer a CLI do Adobe.

Se o site já estiver integrado, verifique se ele aparece no Cloud Manager e pule para a Etapa 2.

As etapas a seguir usam o Projeto de site Frescopa como site de demonstração.

Faça logon no Cloud Manager e abra seu programa com um complemento do Edge Delivery Services. Na visão geral do programa, confirme se a guia Edge Delivery está visível.
Na guia Edge Delivery, conclua a lista de tarefas do Edge Delivery. As principais etapas incluem:
1. Adicionar site do Edge Delivery:
  - Nome do site: Frescopa
  - Origem do Edge Delivery: https://main--frescopa--sachinmali.aem.live/
  O formato é https://<branch>--<site-name>--<organization-name>.aem.live/, onde <branch>, <site-name> e <organization-name> são a ramificação, o nome do site e o nome da organização do projeto de site do Edge Delivery Services, respectivamente.
  
  Idealmente, você deve tentar configurar a ramificação dev do projeto de site do Edge Delivery Services. No entanto, veja abaixo a captura de tela do nosso site de demonstração.
2. Adicionar domínio:
  - Nome do domínio: myfrescopa.enablementadobe.com
  Você deve ter um nome de domínio personalizado configurado para implantar o projeto do AEM Edge Functions, mesmo se estiver tentando no site de desenvolvimento mapeado para a ramificação de desenvolvimento do projeto do site do Edge Delivery Services.
3. Adicionar certificado SSL:
  - Tipo de certificado: gerenciado pelo cliente (OV/EV)
  - Nome do certificado: enablementadobe.com
  - Certificado: o conteúdo do arquivo de certificado assinado entre -----BEGIN CERTIFICATE----- e -----END CERTIFICATE-----
  - Chave privada: o conteúdo do arquivo de chave privada entre -----BEGIN PRIVATE KEY----- e -----END PRIVATE KEY-----
  - Cadeia de certificados: o conteúdo do arquivo da cadeia de certificados entre -----BEGIN CERTIFICATE----- e -----END CERTIFICATE-----
  Você também pode usar o certificado Adobe managed (DV), para fins de tutorial; estamos usando um certificado gerenciado pelo cliente (OV/EV) como exemplo.
4. Adicionar um registro DNS em seu serviço de hospedagem de DNS para myfrescopa.enablementadobe.com.
5. Mapeie o domínio myfrescopa.enablementadobe.com para a CDN gerenciada pela Adobe.
Verifique se o site aparece na tabela Sites do Edge Delivery. O site de demonstração Frescopa está acessível em https://myfrescopa.enablementadobe.com/.

Para obter uma apresentação completa, consulte Adicionar um site do Edge Delivery ao Cloud Manager.

Etapa 2: instalar CLI e plug-ins

Instale ou atualize a aio CLI do Adobe e o plug-in AEM Edge Functions.

Nova instalação

Para uma nova instalação, execute os seguintes comandos:

code language-bash
`# Install the Adobe CLI $ npm install -g @adobe/aio-cli # Install the AEM Edge Functions plugin $ aio plugins install @adobe/aio-cli-plugin-aem-edge-functions`

Atualizar existente

Atualize a CLI do Adobe e os plug-ins instalados:

code language-bash
`# Update the Adobe CLI $ aio update # List installed plugins (confirm the AEM Edge Functions plugin is listed) $ aio plugins # Update the installed plugins $ aio plugins update`

Por exemplo, a instalação bem-sucedida do plug-in de funções da CLI e do AEM Edge deve ser semelhante ao seguinte:

saída da versão da CLI

Etapa 3: Configurar Funções do AEM Edge

As Funções Edge do AEM devem ser configuradas no domínio do site do Edge Delivery Services. Ele permite implantar arquivos de código e configuração no Adobe CDN para que você possa chamar as rotas compatíveis com as Funções do AEM Edge a partir do código do JavaScript no seu site.

Para configurar as Funções do AEM Edge, execute o seguinte comando:

$ aio aem edge-functions setup

Se você ainda não estiver conectado ao Adobe IMS, o comando acionará o fluxo de logon. O processo de configuração solicita detalhes de configuração de programa, tipo de site, site do Edge Delivery e projeto ADC. Selecione Edge Delivery Services como o tipo de site. Os detalhes da configuração são armazenados no arquivo .aio, que fornece o contexto para os comandos da CLI de Funções do AEM Edge a partir de agora.

Prompts de configuração das Funções do AEM Edge

Observe que a instalação associa o site Frescopa Edge Delivery ao domínio myfrescopa.enablementadobe.com.

IMPORTANT

A configuração do projeto Adobe Developer Console (ADC) para credenciais de API - que inclui o cartão de API da rede de entrega de conteúdo (CDN) da AEM - não é feita como parte deste tutorial. No entanto, isso deve ser feito quando você deseja implantar os projetos do AEM Edge Functions a partir do seu sistema de CI/CD. Consulte Integração do Adobe Developer Console e Configuração de CI/CD para obter mais informações.

Use o seguinte comando para revisar os detalhes de configuração das Funções Edge do AEM:

$ aio aem edge-functions info

A saída deve ser semelhante ao seguinte:

Saída de informações de Funções do AEM Edge

Etapa 4: Criar projeto do AEM Edge Functions

Crie o projeto AEM Edge Functions a partir do modelo GitHub aem-edge-functions-boilerplate. O modelo inclui os arquivos e a configuração necessária para começar.

Navegue até aem-edge-functions-boilerplate no GitHub.
No canto superior direito, selecione Usar este modelo > Criar um novo repositório.
Forneça o nome do repositório (por exemplo, frescopa-edge-functions), adicione uma descrição, defina a visibilidade como Particular e selecione Criar repositório.

Etapa 5: Clonar, revisar e executar o projeto do AEM Edge Functions

Clonar o projeto do AEM Edge Functions

Clonar o repositório que você criou na Etapa 4, em seguida, abri-lo junto com o projeto do site do Frescopa (ou seu próprio) Edge Delivery em seu IDE. A maioria dos editores é compatível com espaços de trabalho ou exibições de várias raízes que permitem trabalhar em ambos os projetos ao mesmo tempo.

# Clone the repository
$ git clone https://github.com/<your-org>/<your-project-name>.git

Por exemplo, consulte o projeto do site Frescopa Edge Delivery e o projeto Frescopa AEM Edge Functions como espaço de trabalho no IDE:

Projeto de site Frescopa Edge Delivery e projeto Frescopa AEM Edge Functions como espaço de trabalho no IDE

Revisar o projeto do AEM Edge Functions

Antes de fazer alterações ou implantar o projeto do AEM Edge Functions, revise os arquivos principais que definem o contrato do AEM Edge Functions.

package.json contém as dependências do projeto. Observe a dependência @fastly/js-compute. Para obter mais informações, consulte JavaScript na plataforma de Computação.

src/index.js é o ponto de entrada da função e contém a lógica principal do projeto. Ele usa o padrão addEventListener("fetch", ...) do Fastly Compute. Todas as solicitações recebidas fluem através da função handleRequest, onde você adiciona a lógica de correspondência de rotas. Por exemplo, o código a seguir é da chapa:

code language-js

code language-js
// 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; }

// 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;
}

Uma única Função Edge do AEM pode manipular várias rotas pelas instruções if em handleRequest.

fastly.toml configura o servidor de desenvolvimento local. Para obter mais informações, consulte a referência de Fastly.toml.
config/ contém os arquivos de configuração para o serviço AEM Edge Function e as regras de roteamento CDN. Implante esses arquivos por meio do pipeline de configuração do Edge Delivery no Cloud Manager. A etapa 6 aborda esse processo.

Revise os arquivos de projeto restantes como test/, src/lib/ e README.md para entender a configuração completa.

Executar o projeto AEM Edge Functions localmente

Para iterar rapidamente, você pode executar o projeto AEM Edge Functions localmente. No diretório do projeto do AEM Edge Functions, instale as dependências e inicie o servidor de desenvolvimento local:

# Navigate to the project directory (replace with your project name)
$ cd frescopa-edge-functions

# Install dependencies
$ npm install

# Start the local development server
$ aio aem edge-functions serve

O servidor inicia às http://127.0.0.1:7676.

Por exemplo, a saída deve ser semelhante à seguinte captura de tela:

Saída do servidor de desenvolvimento local

Etapa 6: Revisar e implantar a configuração da CDN

O projeto do AEM Edge Functions inclui arquivos de configuração de CDN. Revise-as e implante usando o pipeline de configuração do Edge Delivery no Cloud Manager.

Revisar configuração da CDN

Revise os arquivos de configuração CDN no diretório config/ do projeto AEM Edge Functions.

config/edgeFunctions.yaml declara o serviço AEM Edge Function. Por exemplo:

kind: "EdgeFunctions"
version: "1"
data:
  functions:
    - name: my-edge-function

Para obter mais informações sobre propriedades com suporte, consulte edgeFunctions.yaml reference.

config/cdn.yaml declara as regras de roteamento CDN que direcionam o tráfego para o serviço AEM Edge Function. Por exemplo:

kind: 'CDN'
version: '1'
data:
  originSelectors:
    rules:
      - name: route-weather-to-edge-function
        when: { reqProperty: path, equals: "/weather" }
        action:
          type: selectAemOrigin
          originName: edgefunction-my-edge-function
          skipCache: true
      - name: route-hello-world-to-edge-function
        when: { reqProperty: path, equals: "/hello-world" }
        action:
          type: selectAemOrigin
          originName: edgefunction-my-edge-function
          skipCache: true

Principais chamadas de retorno:

O originName deve seguir o padrão edgefunction-<edge-function-name>, onde <edge-function-name> é o nome da Função Edge do AEM declarada em edgeFunctions.yaml.
O type deve ser selectAemOrigin.
O skipCache está definido como true para ignorar o cache CDN da solicitação.

Para obter mais informações, consulte Seletores de origem.

Gerenciar configuração da CDN

Implante a configuração da CDN por meio do pipeline de configuração do Cloud Manager. Primeiro, disponibilize os arquivos config/ do seu projeto do AEM Edge Functions para o Cloud Manager. Você tem duas opções:

Repositório do Adobe: crie um novo repositório no Cloud Manager para seu programa.
Repositório privado: vincule seu repositório GitHub existente à Cloud Manager.

Este tutorial usa o projeto Frescopa AEM Edge Functions da Etapa 4 como um repositório privado.

No Cloud Manager, abra Repositórios e selecione Adicionar Repositório.
Na caixa de diálogo Adicionar Repositório, selecione Repositório Privado e forneça o nome, a URL e o tipo do repositório. Selecione Salvar.
Conclua as etapas na caixa de diálogo Validação de Propriedade de Repositório Privado.
1. Conceder acesso ao repositório para o Cloud Manager:
2. Armazene o segredo da validação no repositório do projeto do AEM Edge Functions:

Após a conclusão da validação, o repositório privado aparecerá na tabela Repositórios.

Implantar configuração de CDN

Crie e execute um pipeline de configuração do Edge Delivery no Cloud Manager.

Na página de visão geral, abra a guia Edge Delivery. Em Pipelines, selecione Adicionar pipeline do Edge Delivery.
Na caixa de diálogo Adicionar pipeline do Edge Delivery, forneça um nome e selecione Continuar.
Na etapa Código Source, selecione o repositório privado adicionado, a ramificação main e /config como o local do código. Selecione Salvar.
Execute o pipeline selecionando … ao lado do nome do pipeline e Executar.

A execução bem-sucedida implanta os arquivos edgeFunctions.yaml e cdn.yaml no domínio do site do Edge Delivery.

Verifique se a configuração do CDN foi implantada com êxito:

$ aio aem edge-functions list

A saída deve listar my-edge-function (ou qualquer nome declarado em edgeFunctions.yaml).

Saída da lista de Funções do AEM Edge

Etapa 7: criar e implantar o projeto do AEM Edge Functions

Crie e implante o projeto AEM Edge Functions usando os seguintes comandos, que usam o contexto armazenado no arquivo .aio.

# Navigate to the AEM Edge Functions project directory (replace with your project name)
$ cd frescopa-edge-functions

# Review to make sure you are deploying to the correct Edge Delivery Services site
$ aio aem edge-functions info

# Build the project
$ aio aem edge-functions build

# Deploy to Adobe CDN
$ aio aem edge-functions deploy my-edge-function

O nome passado para deploy deve corresponder ao name declarado em config/edgeFunctions.yaml. Você também deve fazer parte do perfil de produto Gerente de implantação do Cloud Manager.

Por exemplo, a saída deve ser semelhante à seguinte captura de tela:

Saída de compilação e implantação das Funções Edge do AEM

IMPORTANT

Para implantar o projeto AEM Edge Functions do seu sistema de CI/CD, você precisa do projeto Adobe Developer Console (ADC) para obter credenciais de API. Consulte Integração do Adobe Developer Console e Configuração de CI/CD para obter mais informações.

Etapa 8: verificar o endpoint

Verifique os pontos de extremidade implantados em um navegador ou com curl:

$ curl https://myfrescopa.enablementadobe.com/hello-world
$ curl https://myfrescopa.enablementadobe.com/weather

Substitua o domínio pelo domínio do site do Edge Delivery na Etapa 1.

Por exemplo, as respostas são semelhantes à seguinte captura de tela:

Respostas do ponto de extremidade ao vivo

NOTE

O domínio edgefunction-pXXXXX-dYYYYY-<edge-function-name>.adobeaemcloud.com está disponível somente para depuração e não há garantias de que seja estável. Na produção, as solicitações atingem a Função Edge do AEM por meio do domínio personalizado do site através das regras de roteamento CDN em cdn.yaml.

Em cenários reais, use as Funções do AEM Edge para lógica do lado do servidor na CDN e chame-as do JavaScript bloco do site. Consulte a documentação do produto AEM Edge Functions para obter a configuração avançada.

Resumo

Você integrou o site Frescopa Edge Delivery no Cloud Manager, instalou a CLI, configurou o AEM Edge Functions no Edge Delivery Services, criou e executou o projeto localmente, implantou a configuração de CDN, criou e implantou a função do AEM Edge e verificou o endpoint.

Recursos adicionais

recommendation-more-help

experience-manager-learn-help-cloud-service