Publicar a API com o GitHub Actions
Você adicionou a API ao aplicativo Web e eles estão sendo executados localmente. Agora, é hora de publicar a API e o aplicativo nos Aplicativos Web Estáticos do Azure.
Quando você criou a instância dos Aplicativos Web Estáticos do Azure e solicitou que ela inspecionasse a ramificação principal, uma GitHub Action foi gerada para você. O GitHub Action escuta as alterações no branch principal do repositório e, quando detecta uma solicitação de confirmação ou pull para a principal, ele compila e publica seu aplicativo.
Talvez você se lembre de que, quando criou o recurso Aplicativos Web Estáticos do Azure, forneceu o local da pasta para sua API. Você forneceu o valor padrão de api. No entanto, como você não tinha uma API na pasta api na época, o Azure Static Web Apps não tentou publicar uma API.
Agora, tudo muda.
Configuração da Ação do GitHub
A pasta .github/fluxos de trabalho contém o arquivo de Ação do GitHub. O arquivo contém as configurações para os locais de seu aplicativo web, API e artefatos de construção. Os locais que você escolheu quando criou o recurso de Aplicativos Web Estáticos do Azure agora estão localizados neste arquivo, conforme mostrado aqui:
app_location: 'angular-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'dist/angular-app' # Built app content directory - optional
app_location: 'react-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'build' # Built app content directory - optional
app_location: 'svelte-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'public' # Built app content directory - optional
app_location: 'vue-app' # App source code path
api_location: 'api' # Api source code path - optional
output_location: 'dist' # Built app content directory - optional
O seu api_location está configurado com o valor correto para apontar para sua API na pasta api.
Disparar a GitHub Action
A GitHub Action está pronta para compilar e publicar o aplicativo Web e a API assim que detectar uma alteração na ramificação principal. Para acionar a ação do GitHub, você pode fazer o commit diretamente ou criar um pull request para o branch principal. As alterações detectadas na ramificação principal acionam o GitHub Action para publicar o aplicativo na mesma URL do seu site ativo.
URLs de visualização
Às vezes, você deseja ver suas alterações em um ambiente de teste antes de publicar no site ao vivo. Os Aplicativos Web Estáticos do Azure permitem que você veja uma visualização de suas alterações por meio de URLs de visualização. Você pode criar um URL de visualização criando uma pull request na ramificação que a GitHub Action está inspecionando. Seu site ativo não é afetado. No lugar disso, é criada uma nova versão de teste do seu aplicativo. Se você voltar e verificar seu pull request no GitHub, deverá ver um link para a versão de teste postada na aba Conversa.
A tabela a seguir mostra como os Aplicativos Web Estáticos do Azure publicam seu aplicativo em diferentes URLs. O aplicativo é publicado em uma URL enquanto uma solicitação de pull para o mesmo branch é publicada em outra URL.
| Fonte | Descrição | URL |
|---|---|---|
| ramificação principal | URL do site ativo | https://purple-rain-062d03304.azurestaticapps.net/ |
| Solicitação de pull #5 | URL de visualização | https://purple-rain-062d03304-5.azurestaticapps.net/ |
No momento, você está trabalhando no ramificação da API. Faça uma pull request da ramificação da API para a ramificação principal. Quando você cria a solicitação de pull para a ramificação principal, a GitHub Action publica o aplicativo em um URL de visualização.
Depois que o fluxo de trabalho concluir a criação e a implantação do aplicativo, o bot do GitHub adicionará um comentário à sua solicitação de pull que contém a URL do ambiente de pré-produção. Você pode selecionar este link para ver suas alterações em etapas.
Em seguida, crie um pull request e visite a versão preparada do seu aplicativo.