Como escrever edge functions

Antes de começar

Para você começar e ter sucesso como um edge developer, é importante:

As edge functions funcionam sobre o Azion Edge Runtime, que é um conjunto de ferramentas que permitem o desenvolvimento no edge.

É fundamental conhecer a lista de APIs, métodos e tipos disponíveis. Saiba mais sobre o Azion Edge Runtime.

Editor de Código

O Edge Functions Code Editor fornece uma experiência de desenvolvimento semelhante à que os desenvolvedores estão acostumados. A integração entre Edge Functions e ChatGPT ajuda você a escrever, refatorar e revisar o código.

Edge Functions e Edge Application

Para desenvolver sua primeira edge function para Edge Application:

No Azion Console, no canto superior esquerdo, selecione o Products menu, representado por três linhas horizontais.
Na seção Edge Libraries, Selecione Edge Functions.
Clique em Add a Function.
Escolha um nome para sua função.
Escreva sua função. Mas espere, antes disso, continue lendo:

Escrever uma edge function

Primeiro, as edge functions para Edge Application funcionam com base em um fetch event. Ele é inicializado com uma função addEventListener, passando fetch como o tipo de evento e um evento. Por exemplo:

  addEventListener('fetch', event => {
      event.respondWith(handleRequest(event.request));
    });

Em segundo lugar, é necessário definir o comportamento da função handleRequest. Esta função tem como assinatura o event.request. Esses dados podem ser usados posteriormente para implementar a lógica necessária, como:

Manipular cookies.
Implementar um comportamento com base no método de solicitação (POST, GET, PUT, DELETE).
Acessar os metadados da requisição.

A função handleRequest pode ser definida como:

  const html = `<!DOCTYPE html>
  <body>
    <h1>Hello World</h1>
    <p>This markup was generated by Azion - Edge Functions.</p>
  </body>`

  async function handleRequest(request) {
    return new Response(html, {
      headers: {
        "content-type": "text/html;charset=UTF-8",
      },
    })
  }

Neste exemplo, a resposta será o conteúdo HTML, declarado anteriormente pelo const html. Os headers também podem ser manipulados e, no exemplo, o Content-Type é definido.

Teste e depuração

Depois de escrever suas edge functions, você pode visualizar a resposta e inspecionar o código. O preview simula uma requisição e essa simulação pode ser alterada para atender às necessidades do desenvolvedor.

Saiba mais sobre o Preview Deployment.

É possível debugar as funções através de:

Function instantiation

Depois de salvar sua edge function, é necessário instanciá-la em uma edge application.

Saiba mais sobre como instanciar uma edge function em uma edge application.

Contribuidores