Construtor de API de Dados de Host em Aplicativos Web Estáticos do Azure (visualização)

• Uma conta do Azure com uma assinatura ativa. Crie uma conta gratuitamente.

• CLI de Aplicativos Web Estáticos do Azure. Instale a CLI de aplicativos Web estáticos (SWA).

• CLI do construtor de API de dados. Instale a CLI do Data API builder (DAB).

• Banco de dados existente com suporte endereçável do Azure.

• Aplicativo Web existente em um repositório GitHub que pode ser implantado em Aplicativos Web Estáticos do Azure. - Se você não tem uma aplicação web, gerar um repositório com uma aplicação web básica.

Para começar, use o portal do Azure para criar um novo Aplicativo Web Estático do Azure usando o aplicativo Web no GitHub.

1. Entre no portal do Azure (https://portal.azure.com).

2. Crie um novo grupo de recursos. Você usará este grupo de recursos para todos os novos recursos neste guia.

   

   Dica

   Recomendamos nomear o grupo de recursos msdocs-dab-swa. Todas as capturas de tela neste guia usam esse nome.

3. Crie um Aplicativo Web Estático do Azure. Use essas configurações para configurar o aplicativo Web estático.

   Cenário	Valor
   Grupo de recursos	Selecione o grupo de recursos criado anteriormente
   Nome	Insira um nome globalmente exclusivo
   Tipo de plano	Selecione a melhor opção para a sua carga de trabalho
   de origem	Selecione do GitHub
   conta do GitHub	Configurar uma conta do GitHub que tenha acesso ao repositório de aplicativos Web
   Organização	Selecione a organização pai ou o usuário para o repositório
   Repositório	Selecione o nome do repositório
   Filial	Selecione a ramificação principal

   

4. Aguarde a conclusão da implantação do aplicativo Web estático. Um fluxo de trabalho de Ações do GitHub é adicionado automaticamente ao seu repositório que implantará o aplicativo nos Aplicativos Web Estáticos do Azure sempre que você enviar por push para a ramificação principal.

   Observação

   Essa implantação inicial pode levar alguns minutos. Você sempre pode verificar o status da implantação no portal do Azure ou na guia Ações do GitHub em seu repositório.

5. Navegue até o novo aplicativo Web estático no portal do Azure.

6. Na seção do Essentials, use a URL hiperlink para navegar até o aplicativo Web em execução. Verifique se o aplicativo está sendo executado conforme o esperado.

Agora, use as interfaces de linha de comando DAB e SWA para criar um novo arquivo de configuração DAB e adicioná-lo ao repositório de aplicativos Web.

1. Abra o repositório GitHub para seu aplicativo Web no ambiente de desenvolvedor integrado (IDE) de sua escolha.

   Dica

   Você pode usar qualquer IDE que desejar. Se quiser trabalhar no aplicativo localmente, você pode clonar o repositório para sua máquina local. Se preferir trabalhar no navegador, você pode usar GitHub Codespaces. Certifique-se de que as CLIs SWA e DAB estejam instaladas em seu ambiente de desenvolvimento.

2. Abra um terminal na raiz do repositório.

3. Use o comando swa db da CLI SWA para inicializar um novo arquivo de configuração DAB usando o tipo de banco de dados especificado. O comando criará um novo arquivo chamado staticwebapp.database.config.json na pasta swa-db-connections.

   swa db init --database-type "<database-type>"
   

   Importante

   Alguns tipos de banco de dados exigirão definições de configuração adicionais na inicialização.

4. Use o comando dab add para adicionar pelo menos uma entidade de banco de dados à configuração. Configure cada entidade para permitir todas as permissões para usuários anônimos. Repita dab add quantas vezes quiser para as suas entidades.

   dab add "<entity-name>" --source "<schema>.<table>" --permissions "anonymous:*" --config "swa-db-connections/staticwebapp.database.config.json"
   

5. Abra e revise o conteúdo do arquivo swa-db-connections/staticwebapp.database.config.json.

6. Confirme suas alterações no repositório e envie-as para a ramificação principal. Isso acionará automaticamente uma nova implantação do aplicativo Web. Aguarde a conclusão desta última implantação antes de continuar com este guia.

Em seguida, configure a conexão de banco de dados no portal do Azure para permitir que o aplicativo Web estático acesse o banco de dados.

1. Navegue até o aplicativo Web estático novamente no portal do Azure.

2. Selecione a opção de conexão do banco de dados na seção Configurações do do menu de recursos. Em seguida, selecione Vincular de banco de dados existente para o ambiente de de produção .

   

3. Na caixa de diálogo banco de dados Link, use essas configurações para configurar a conexão do banco de dados.

   Cenário	Valor
   Tipo de banco de dados	Selecione o mesmo tipo de banco de dados usado ao criar o arquivo de configuração DAB
   Grupo de recursos	Selecione o grupo de recursos criado anteriormente neste guia
   Nome do recurso	Selecione o recurso de banco de dados que você deseja vincular ao aplicativo Web estático
   Nome do banco de dados	Insira o nome do banco de dados
   Tipo de autenticação	Selecione o tipo de autenticação que pretende utilizar

   

   Dica

   Recomendamos o uso de uma cadeia de conexão que não inclua chaves de autorização. Em vez disso, use identidades gerenciadas e controle de acesso baseado em função para gerenciar o acesso entre o banco de dados e o host. Para obter mais informações, consulte serviços do Azure que usam identidades gerenciadas.

Por fim, valide se o ponto de extremidade da API de dados está disponível no aplicativo Web estático.

1. Navegue até o aplicativo Web estático novamente no portal do Azure.

2. Use o campo URL na seção do Essentials para navegar até o site do aplicativo Web estático novamente.

3. Navegue até o caminho /data-api para o aplicativo em execução atual. Observe que a resposta ainda indica que o contêiner DAB é saudável.

   { Healthy }
   

4. Navegue até o caminho https://<your-static-web-app-url>/data-api/<your-rest-path>/<your-entity-name> para o aplicativo em execução atual. Isso emite uma solicitação HTTP GET para esse conjunto de entidades. Observe a resposta JSON.

Quando você não precisar mais do aplicativo ou recursos de exemplo, remova a implantação correspondente e todos os recursos.

1. Navegue até o grupo de recursos usando o portal do Azure.

2. Na barra de comandos , selecione Excluir.