Traga as suas próprias funções para as Aplicações Web Estáticas do Azure

Os Aplicativos Web Estáticos do Azure fornecem integração de API para permitir que você crie aplicativos Web front-end que dependem de APIs de back-end para dados e serviços. As duas opções de integração de API são: funções gerenciadas e traga seus próprios backends. Para obter mais informações sobre as diferenças entre essas opções, consulte a visão geral.

Este artigo demonstra como vincular um aplicativo existente do Azure Functions a um recurso do Azure Static Web Apps.

Pré-requisitos

Para vincular um aplicativo de função ao seu aplicativo Web estático, você precisa ter um recurso existente do Azure Functions e um aplicativo Web estático.

Exemplo

Considere um aplicativo existente do Azure Functions que exponha um ponto de extremidade por meio do seguinte local.

https://my-functions-app.azurewebsites.net/api/getProducts

Uma vez vinculado, você pode acessar esse mesmo ponto de extremidade através do caminho do api seu aplicativo Web estático, conforme mostrado neste URL de exemplo.

https://red-sea-123.azurestaticapps.net/api/getProducts

Ambos os URLs de ponto de extremidade apontam para a mesma função. O ponto de extremidade no aplicativo de função deve ter o prefixo, já que Static Web Apps corresponde às solicitações feitas e /api faz proxy de todo o caminho para o /api recurso vinculado.

Vincular um aplicativo existente do Azure Functions

Remover funções gerenciadas do recurso Static Web Apps (se houver)

Antes de associar um aplicativo Functions existente, primeiro você precisa ajustar a configuração do seu aplicativo Web estático para remover funções gerenciadas, se tiver alguma.

1. Defina api_location o valor como uma cadeia de caracteres vazia ("") no arquivo de configuração do fluxo de trabalho.

Vincular o aplicativo Azure Functions ao recurso Aplicativos Web estáticos

1. Abra sua instância de Aplicativos Web estáticos no portal do Azure.

2. No menu Configurações, selecione APIs.

3. Na linha Produção, selecione Link para abrir a janela Vincular novo back-end.

   Introduza as seguintes definições.

   Definição	Valor
   Tipo de recurso de back-end	Selecione Aplicativo de função.
   Subscrição	Selecione o nome da sua assinatura do Azure.
   Nome do recurso	Selecione o nome do aplicativo Azure Functions.
   Ranhura de back-end	Selecione o nome do slot para a Função do Azure.

4. Selecionar Ligação.

O aplicativo Azure Functions agora está mapeado para a /api rota do seu aplicativo Web estático.

Implementação

Você é responsável por configurar um fluxo de trabalho de implantação para seu aplicativo Azure Functions.

Desvincular um aplicativo do Azure Functions

Desvincular o aplicativo Funções de aplicativos Web estáticos

Para desvincular um aplicativo de função de um aplicativo Web estático, siga estas etapas:

1. No portal do Azure, vá para o aplicativo Web estático.

2. Selecione APIs no menu de navegação.

3. Localize o ambiente que você deseja desvincular e selecione o nome do aplicativo da função.

4. Selecione Desvincular.

Quando o processo de desvinculação estiver concluído, as solicitações para rotas que começam com /api não serão mais intermediadas por proxy para seu aplicativo Azure Functions.

Remover autenticação do recurso Azure Functions

Para permitir que seu aplicativo Azure Functions receba tráfego anônimo, siga estas etapas para remover o provedor de identidade:

1. No portal do Azure, navegue até o recurso Azure Functions.

2. Selecione Autenticação no menu de navegação.

3. Na lista de provedores de identidade, exclua o provedor de identidade relacionado ao recurso Static Web Apps.

4. Selecione Remover autenticação para remover a autenticação e permitir tráfego anônimo para seu recurso do Azure Functions.

Seu aplicativo de função agora pode receber tráfego anônimo.

Restrições de segurança

• Autenticação e autorização: se as políticas de autenticação e autorização ainda não estiverem configuradas no seu aplicativo Functions existente, o aplicativo Web estático terá acesso exclusivo à API. Para tornar seu aplicativo Functions acessível a outros aplicativos, adicione outro provedor de identidade ou altere as configurações de segurança para permitir acesso não autenticado.

  Nota

  Se você habilitar a autenticação e a autorização em seu aplicativo Functions vinculado, ele deverá usar o provedor de autorização e Autenticação do Serviço de Aplicativo do Azure versão 2.

• Acessibilidade pública necessária: um aplicativo Functions existente não precisa aplicar as seguintes configurações de segurança.

  • Restringir o endereço IP da aplicação Funções.
  • Restringir o tráfego através de links privados ou pontos de extremidade de serviço.

• Teclas de acesso à função: Se a sua função requer uma chave de acesso, então você deve fornecer a chave com chamadas do aplicativo estático para a API.

Restrições

• Apenas um aplicativo do Azure Functions está disponível para um único aplicativo Web estático.
• O api_location valor na configuração do fluxo de trabalho deve ser definido como uma cadeia de caracteres vazia.
• Não há suporte em ambientes de solicitação pull de aplicativos Web estáticos.
• Embora seu aplicativo Azure Functions possa responder a vários gatilhos, o aplicativo Web estático só pode acessar funções por meio de pontos de extremidade Http.

Próximos passos