Tutorial: Implantar um aplicativo Web Node.js + MongoDB no Azure

Azure App Service oferece um serviço de alojamento web altamente escalável e auto-corrigível, utilizando o sistema operativo Linux. Este tutorial mostra como criar uma aplicação Node.js segura no Azure App Service que está conectada a uma base de dados Azure Cosmos DB para MongoDB. Quando terminares, terás uma aplicação Express.js a correr no Azure App Service em Linux.

Neste tutorial, aprenderás como:

• Crie uma arquitetura segura por padrão para o Azure App Service e o Azure Cosmos DB com a API do MongoDB.
• Proteja segredos de conexão usando uma identidade gerenciada e referências do Cofre de Chaves.
• Desbloquear uma aplicação de exemplo Node.js no Serviço de Aplicações a partir de um repositório GitHub.
• Aceda às definições da aplicação no Serviço de Aplicativo no código da aplicação.
• Faça atualizações e volte a implementar o código da aplicação.
• Transmitir registos de diagnóstico do App Service.
• Gere a aplicação no portal do Azure.
• Provisione a mesma arquitetura e implante usando a CLI do Azure Developer.
• Otimize seu fluxo de trabalho de desenvolvimento com o GitHub Codespaces e o GitHub Copilot.

Pré-requisitos

• Uma conta Azure com uma subscrição ativa. Se não tiver uma conta Azure, pode criar uma gratuitamente.
• Uma conta GitHub. Pode também obter um gratuitamente.
• Conhecimento do desenvolvimento Express.js.
• (Opcional) Para experimentar o GitHub Copilot, uma conta do GitHub Copilot. Está disponível uma experiência gratuita de 30 dias.

• Uma conta Azure com uma subscrição ativa. Se não tiver uma conta Azure, pode criar uma gratuitamente.
• Azure Developer CLI instalado. Você pode seguir as etapas com o Azure Cloud Shell porque ele já tem a CLI do Desenvolvedor do Azure instalada.
• Conhecimento do desenvolvimento Express.js.
• (Opcional) Para experimentar o GitHub Copilot, uma conta do GitHub Copilot. Está disponível uma experiência gratuita de 30 dias.

Saltar para o fim

Pode implementar rapidamente a aplicação de exemplo neste tutorial e vê-la a funcionar no Azure. Simplesmente execute os seguintes comandos no Azure Cloud Shell e siga as instruções.

mkdir msdocs-nodejs-mongodb-azure-sample-app
cd msdocs-nodejs-mongodb-azure-sample-app
azd init --template msdocs-nodejs-mongodb-azure-sample-app
azd up

1. Execute a amostra

Primeiro, configura uma aplicação orientada por dados de exemplo como ponto de partida. Para sua conveniência, o repositório de exemplo inclui uma configuração de container de desenvolvimento. O contêiner de desenvolvimento tem tudo o que você precisa para desenvolver um aplicativo, incluindo o banco de dados, o cache e todas as variáveis de ambiente necessárias para o aplicativo de exemplo. O container de desenvolvimento pode ser executado num GitHub codespace, o que significa que pode executar o exemplo em qualquer computador com um navegador web.

Passo 1: Em uma nova janela do navegador:

1. Inicie sessão na sua conta do GitHub.
2. Navegar para https://github.com/Azure-Samples/msdocs-nodejs-mongodb-azure-sample-app/fork.
3. Desmarcar Copiar apenas a ramificação principal. Você quer todos os ramos.
4. Selecione Criar ramificação.

2º Passo: No repositório bifurcado do GitHub:

1. Selecione principal>starter-no-infra para o ramo inicial. Este ramo contém apenas o projeto de exemplo e não contém ficheiros ou configurações relacionados com o Azure.
2. Selecione Code>Criar espaço de código em starter-no-infra. O espaço de código demora alguns minutos a configurar.

Etapa 3: No terminal do espaço de código:

1. Executar npm install && npm start.
2. Quando vir a notificação Your application running on port 3000 is available., selecione Abrir no Navegador. Deve ver a aplicação de exemplo num novo separador do navegador. Para parar a aplicação Express.js, digite as teclas Ctrl+C.

Sugestão

Pode perguntar ao GitHub Copilot sobre este repositório. Por exemplo:

• @workspace O que este projeto faz?
• @workspace O que faz a pasta .devcontainer?

A ter problemas? Consulte a secção de resolução de problemas.

2. Criar Serviço de Aplicações e Azure Cosmos DB

Nesta etapa, você cria os recursos do Azure. Os passos usados neste tutorial criam um conjunto de recursos seguros por padrão que incluem App Service e Azure Cosmos DB para MongoDB. Para o processo de criação, você especificará:

• O Nome do aplicativo Web. Ele é usado como parte do nome DNS do seu aplicativo.
• A região onde o aplicativo será executado fisicamente no mundo. Ele também é usado como parte do nome DNS do seu aplicativo.
• A pilha de tempo de execução para o aplicativo. É onde seleciona a versão do Node a utilizar na sua aplicação.
• O plano de alojamento para a aplicação. É o nível de preços que inclui o conjunto de funcionalidades e a capacidade de escalonamento para a sua aplicação.
• O Grupo de Recursos para a aplicação. Um grupo de recursos permite-lhe agrupar (dentro de um contêiner lógico) todos os recursos do Azure necessários para a aplicação.

Inicie sessão no portal Azure e siga estes passos para criar os seus recursos do Azure App Service.

1º Passo: No portal do Azure:

1. Insira "banco de dados de aplicativo Web" na barra de pesquisa na parte superior do portal do Azure.
2. Selecione o item rotulado como Web App + Base de Dados sob o cabeçalho Marketplace. Também pode navegar para o assistente de criação diretamente.

Passo 2: Na página Criar Aplicação Web + Base de Dados, preencha o formulário da seguinte forma.

1. Resource Group: Selecionar Create new e utilizar o nome msdocs-expressjs-mongodb-tutorial.
2. Região: qualquer região do Azure perto de você.
3. Nome: msdocs-expressjs-mongodb-XYZ, onde XYZ é qualquer três caracteres aleatórios.
4. Pilha de tempo de execução: Node 20 LTS.
5. Motor: API do Cosmos DB para MongoDB. O Azure Cosmos DB é uma base de dados nativa da nuvem que oferece uma API 100% compatível com MongoDB. Note o nome da base de dados que foi gerado para si (<app-name>-database). Você precisará dele mais tarde.
6. Plano de hospedagem: Básico. Quando estiver pronto, você poderá escalar para um nível de preço de produção.
7. Selecione Verificar + criar.
8. Após a conclusão da validação, selecione Criar.

Passo 3: A implementação leva alguns minutos para ser concluída. Após a conclusão da implementação, selecione o botão Ir para o recurso. Você é levado diretamente para a aplicação do App Service, mas os seguintes recursos são criados:

• Grupo de recursos → O contentor para todos os recursos criados.
• Plano de Serviço de Aplicações → Define os recursos computacionais para o Serviço de Aplicações. Um plano Linux na camada Basic é criado.
• Serviço de Aplicativo → Representa seu aplicativo e é executado no plano do Serviço de Aplicativo.
• Rede virtual → integrada à aplicação App Service e isola o tráfego da rede back-end.
• Private endpoint → Ponto de acesso para o recurso de base de dados na rede virtual.
• Interface de rede → Representa um endereço IP privado para o ponto final privado.
• Azure Cosmos DB for MongoDB → Acessível apenas a partir do endpoint privado. Uma base de dados e um utilizador são criados para si no servidor.
• Zona DNS privada → Habilita a resolução DNS do servidor Azure Cosmos DB na rede virtual.

A ter problemas? Consulte a secção de resolução de problemas.

Proteja os segredos de conexão

O assistente de criação gerou a string de conectividade para si já como uma definição de aplicação. No entanto, a melhor prática de segurança é manter os segredos completamente fora do App Service. Vais mover os teus segredos para um cofre de chaves e alterar a configuração da tua aplicação para uma referência de cofre de chaves com a ajuda dos Conectores de Serviço.

Passo 1: Na página de Serviço de Aplicações:

1. No menu à esquerda, selecione Definições > Variáveis de ambiente.
2. Ao lado de AZURE_COSMOS_CONNECTIONSTRING, selecione Mostrar valor. Esta string de conexão permite que você se conecte ao banco de dados Cosmos DB, protegido atrás de um ponto final privado. No entanto, o segredo é guardado diretamente na aplicação do App Service, o que não é o melhor. Vais mudar isto.

Passo 2: Crie um cofre de chaves para a gestão segura de segredos.

1. Na barra de pesquisa superior, digite "key vault", depois selecione Marketplace>Key Vault.
2. No Grupo de Recursos, selecione msdocs-expressjs-mongodb-tutorial.
3. Na Key vault name, insira um nome que consiste apenas em letras e números.
4. Na Região, defina-a na localização de exemplo como o grupo de recursos.

Passo 3:

1. Selecione a aba Rede.
2. Desmarque Permitir acesso público.
3. Selecione Criar um ponto final privado.
4. No Grupo de Recursos, selecione msdocs-expressjs-mongodb-tutorial.
5. Na Key vault name, insira um nome que consiste apenas em letras e números.
6. Na Região, defina-a na localização de exemplo como o grupo de recursos.
7. Na caixa de diálogo, em Localização, selecione a mesma localização que a sua aplicação do Serviço de Aplicações.
8. No Grupo de Recursos, selecione msdocs-expressjs-mongodb-tutorial.
9. Em Name, insira msdocs-expressjs-mongodb-XYZVaultEndpoint.
10. Em Rede virtual, selecione msdocs-expressjs-mongodb-XYZVnet.
11. Em Sub-rede, msdocs-expressjs-mongodb-XYZSubnet.
12. Selecione OK.
13. Selecione Rever + criar e, em seguida, selecione Criar. Espere pela conclusão da implementação do cofre de chaves. Deverá ver "A sua implementação está concluída."

Passo 4:

1. Na barra de pesquisa superior, digite msdocs-expressjs-mongodb e, em seguida, o recurso do Serviço de Aplicativo chamado msdocs-expressjs-mongodb-XYZ.
2. Na página Serviço de Aplicativo, no menu à esquerda, selecione Configurações > do Conector de Serviço. Já existe um conector, que o assistente de criação de aplicativos criou para você.
3. Marque a caixa de seleção ao lado do conector e selecione Editar.
4. Na guia Noções básicas , defina Tipo de cliente como Node.js.
5. Selecione o separador Autenticação.
6. Selecione Armazenar segredo no Cofre da chave.
7. Em Key Vault Connection, selecione Criar nova. A caixa de diálogo Criar conexão é aberta sobre a caixa de diálogo de edição.

Passo 5: Na caixa de diálogo Criar ligação para a ligação ao Key Vault:

1. No Key Vault, selecione o Cofre de Chaves que criou anteriormente.
2. Selecione Avaliar + Criar. Deve verificar que Identidade gerida atribuída pelo sistema está definida como Selecionado.
3. Quando a validação for concluída, selecione Create.

Passo 6: Voltou ao diálogo de edição para defaultConnector.

1. Na aba Autenticação, aguarde a criação do conector do cofre de chaves. Quando estiver concluído, a lista pendente Key Vault Connection seleciona automaticamente.
2. Selecionar Seguinte: Rede.
3. Selecione Configurar regras de firewall para permitir o acesso ao serviço de destino. Se vires a mensagem "Nenhum ponto de extremidade privado no serviço de destino", ignora-a. O assistente de criação de aplicativos já tinha protegido a base de dados do Cosmos DB com um ponto de extremidade privado.
4. Selecione Guardar. Aguarde até que a notificação Atualização bem-sucedida apareça.

7º Passo: Para verificar as alterações:

1. No menu à esquerda, selecione novamente Variáveis de ambiente.
2. Ao lado da definição de app AZURE_COSMOS_CONNECTIONSTRING, selecione Mostrar valor. O valor deve ser @Microsoft.KeyVault(...), o que significa que é uma referência de cofre de chaves porque o segredo agora é gerido no cofre de chaves.

A ter problemas? Consulte a secção de resolução de problemas.

4. Implementar código de exemplo

Neste passo, configura a implementação do GitHub usando GitHub Actions. É apenas uma das muitas maneiras de fazer deploy no App Service, mas também uma ótima forma de ter integração contínua no seu processo de implementação. Por padrão, cada git push no seu repositório GitHub inicia a ação de construção e implementação.

Passo 1: No menu à esquerda, selecione Implementação>Centro de Implementação.

Passo 2: Na página do Centro de Implementação:

1. Em Source, selecione GitHub. Por predefinição, GitHub Actions está selecionado como o fornecedor de build.
2. Entre na sua conta do GitHub e siga o prompt para autorizar o Azure.
3. Em Organização, selecione sua conta.
4. No Repositório, selecione msdocs-nodejs-mongodb-azure-sample-app.
5. Em Branch, selecione starter-no-infra. Esta é a mesma ramificação em que trabalhou com a sua aplicação de exemplo, sem quaisquer ficheiros ou configurações relacionados com o Azure.
6. Para Tipo de autenticação, selecione Identidade atribuída pelo utilizador.
7. No menu superior, selecione Salvar. O App Service compromete um ficheiro de fluxo de trabalho no repositório GitHub escolhido, na diretoria .github/workflows. Por padrão, o centro de implementação cria uma identidade atribuída pelo utilizador para que o fluxo de trabalho se autentique usando Microsoft Entra (autenticação OIDC). Para opções alternativas de autenticação, veja Deploy to App Service using GitHub Actions.

Passo 3: De volta ao codespace no GitHub do seu fork de exemplo, execute git pull origin starter-no-infra. Isso traz o arquivo de fluxo de trabalho recém-confirmado para o seu espaço de código.

Passo 4 (Opção 1: com o GitHub Copilot):

1. Inicie uma nova sessão de chat selecionando a vista Chat, depois selecionando +.
2. Pergunte, "@workspace Como a aplicação se conecta à base de dados?" Copilot poderá apontar para o ficheiro app.js e para a mongoose.connect chamada.
3. Diga, "Tenho uma variável de cadeia de conexão no Azure chamada AZURE_COSMOS_CONNECTIONSTRING.". O Copilot pode oferecer-lhe uma sugestão de código semelhante à das etapas em Opção 2: sem GitHub Copilot abaixo e até sugerir que faça a alteração em app.js.
4. Abra app.js no explorador e adicione a sugestão de código no método getApp. O GitHub Copilot não lhe dá a mesma resposta sempre, pode ser necessário fazer mais perguntas para afinar a sua resposta. Para dicas, consulte O que posso fazer com o GitHub Copilot no meu codespace?.

Passo 4 (Opção 2: sem o Copilot do GitHub):

1. A partir do explorador, abra app.js.
2. Encontre a linha onde mongoose.connect é chamada (Linha 16) e altere process.env.MONGODB_URI para process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URI.

Passo 5:

1. Selecione a extensão Source Control.
2. Na caixa de texto, escreva uma mensagem de commit como Update environment variable. Ou, selecione e deixe o GitHub Copilot gerar uma mensagem de commit para si.
3. Selecione Confirmar, depois confirme com Sim.
4. Selecione Sincronizar alterações 1 e, em seguida, confirme com OK.

Passo 6: De volta à página do Centro de Implementação no portal do Azure:

1. Na guia Logs , selecione Atualizar. Uma nova execução de implantação já foi iniciada a partir das suas alterações confirmadas.
2. No item de registo da execução de implementação, selecione a entrada Registos de Construção/Implementação com a data e hora mais recente.

Passo 7: Você é levado ao seu repositório GitHub e vê que a ação do GitHub está a ser executada. O arquivo de fluxo de trabalho define dois estágios separados, build e deploy. Espere até que a execução no GitHub mostre um estado de Completo.

A ter problemas? Consulte a secção de resolução de problemas.

5. Navegue para a app

Passo 1: Na página de Serviço de Aplicações:

1. No menu à esquerda, selecione Overview.
2. Selecione o URL da sua aplicação.

Passo 2: Adicione algumas tarefas à lista. Parabéns, está a executar uma aplicação Node.js segura e orientada por dados no Azure App Service.

6. Transmitir registos de diagnóstico

O Azure App Service captura todas as mensagens registadas no console para ajudá-lo a diagnosticar problemas com a sua aplicação. A aplicação de amostra gera mensagens de log no console em cada um dos seus endpoints para demonstrar esta capacidade. Por exemplo, o get endpoint emite uma mensagem sobre o número de tarefas recuperadas do banco de dados e uma mensagem de erro aparece caso algo corra mal.

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

Passo 1: Na página de Serviço de Aplicações:

1. No menu à esquerda, selecione Logs do Serviço de Aplicativo.
2. Em Registo de aplicações, selecione Sistema de ficheiros.
3. No menu superior, selecione Salvar.

Passo 2: No menu à esquerda, selecione Log stream. Você vê os registos da sua aplicação, incluindo registos da plataforma e registos de dentro do contentor.

7. Inspecionar os ficheiros implantados usando o Kudu

O Azure App Service oferece uma consola de diagnóstico baseada na web chamada Kudu, que permite examinar o ambiente de alojamento do servidor para a sua aplicação web. Usando o Kudu, pode visualizar os ficheiros implantados no Azure, rever o histórico de implantação da aplicação e até abrir uma sessão SSH no ambiente de hospedagem.

Passo 1: Na página de Serviço de Aplicações:

1. No menu à esquerda, selecione Ferramentas Avançadas.
2. Selecione Avançar.

Passo 2: Na página do Kudu, selecione Implementações.

Se implementar código no App Service utilizando Git ou zip deploy, verá um histórico das implementações da sua aplicação web.

3º Passo: Volte para a página inicial do Kudu e selecione Site wwwroot.

Pode ver a estrutura da pasta implementada e selecionar para explorar e visualizar os ficheiros.

8. Limpeza de recursos

Quando terminar, pode eliminar todos os recursos da sua subscrição Azure ao eliminar o grupo de recursos.

Passo 1: Na barra de pesquisa no topo do portal Azure:

1. Insira o nome do grupo de recursos.
2. Selecione o grupo de recursos.

Passo 2: Na página do grupo de recursos, selecione Eliminar grupo de recursos.

Passo 3:

1. Introduza o nome do grupo de recursos para confirmar a sua eliminação.
2. Selecione Eliminar.

2. Criar recursos do Azure e implementar uma aplicação de exemplo

Neste passo, você cria os recursos do Azure e implementa uma aplicação de exemplo no App Service no Linux. Os passos utilizados neste tutorial criam um conjunto de recursos seguros por defeito que incluem o App Service e o Azure Cosmos DB.

O contentor de desenvolvimento já possui o Azure Developer CLI (AZD).

1. A partir do diretório raiz do repositório, execute azd init.

   azd init --template nodejs-app-service-cosmos-redis-infra
   

2. Quando solicitado, forneça as seguintes respostas:

   Questão	Resposta
   O diretório atual não está vazio. Gostaria de iniciar um projeto aqui em '<your-directory>'?	Y
   O que gostaria de fazer com estes ficheiros?	Manter os meus ficheiros existentes inalterados
   Insira um novo nome para o ambiente	Digite um nome único. O template AZD utiliza este nome como parte do nome DNS da sua aplicação web no Azure (<app-name>-<hash>.azurewebsites.net). Caracteres alfanuméricos e hífens são permitidos.

3. Inicie sessão no Azure executando o comando azd auth login e seguindo as instruções.

   azd auth login
   

4. Crie os recursos necessários do Azure e implemente o código da aplicação com o comando azd up. Siga as instruções para selecionar a subscrição e a localização desejadas para os recursos do Azure.

   azd up
   

   O comando azd up demora cerca de 15 minutos a concluir (o cache do Redis demora mais tempo). Ele também compila e implementa o código da sua aplicação, mas você irá modificar o seu código mais tarde para funcionar com o App Service. Enquanto está em execução, o comando fornece mensagens sobre o processo de aprovisionamento e implantação, incluindo um link para a implantação no Azure. Quando terminar, o comando também exibe um link para a aplicação de implementação.

   Este modelo AZD contém ficheiros (azure.yaml e o diretório infra) que geram uma arquitetura segura por padrão com os seguintes recursos do Azure:

   • Grupo de recursos: O contêiner para todos os recursos criados.
   • App Service plan: Define os recursos de computação para o App Service. Um plano Linux na categoria B1 é criado.
   • App Service: Representa a sua aplicação e opera no plano App Service.
   • Rede virtual: Integrada com a aplicação do App Service e isola o tráfego de rede back-end.
   • Azure Cosmos DB account with MongoDB API: Acessível apenas a partir do seu ponto final privado. Uma base de dados é criada para si no servidor.
   • Azure Cache for Redis: Acessível apenas a partir da rede virtual.
   • Key vault: Acessível apenas a partir de seu endpoint privado. Utilizado para gerir segredos para a aplicação do App Service.
   • Pontos de extremidade privados: pontos de extremidade de acesso para o cofre de chaves, o servidor de banco de dados e o cache Redis na rede virtual.
   • Zonas DNS Privadas: Permitir a resolução de DNS da base de dados do Cosmos DB, da cache do Redis e do cofre de chaves na rede virtual.
   • Log Analytics workspace: Atua como o contentor alvo para a sua aplicação enviar os seus registos, onde também pode consultar os registos.

   Assim que o comando terminar de criar os recursos e de implementar o código da aplicação pela primeira vez, a aplicação de exemplo implementada ainda não funcionará porque é necessário fazer pequenas alterações para conectá-la à base de dados no Azure.

3. Verificar strings de conexão

O modelo AZD que utiliza já gerou as variáveis de conectividade para si como definições de aplicação e as exporta para o terminal para sua conveniência. As definições da aplicação são uma forma de manter os segredos de conexão fora do seu repositório de código.

1. No output do AZD, encontre a definição da aplicação AZURE_COSMOS_CONNECTIONSTRING. Apenas os nomes das definições são exibidos. Eles são apresentados assim na saída AZD:

    App Service app has the following app settings:
            - AZURE_COSMOS_CONNECTIONSTRING
            - AZURE_REDIS_CONNECTIONSTRING
            - AZURE_KEYVAULT_RESOURCEENDPOINT
            - AZURE_KEYVAULT_SCOPE
    

   AZURE_COSMOS_CONNECTIONSTRING contém a string de conexão para a base de dados Cosmos DB no Azure. Vai precisar de usá-lo no seu código mais tarde.

2. Para sua conveniência, o modelo AZD mostra-lhe o link direto para a página de configurações da aplicação. Encontre o link e abra-o numa nova aba do navegador.

A ter problemas? Consulte a secção de resolução de problemas.

4. Modifique o código de exemplo e reimplante

Com o Copilot do GitHub

1. No espaço de código do GitHub, inicie uma nova sessão de chat clicando na vista Chat e, em seguida, clicando em +.

2. Pergunte, "@workspace Como a aplicação se conecta à base de dados?" Copilot poderá apontar para o ficheiro app.js e para a mongoose.connect chamada.

3. Diga, "Eu tenho uma variável de cadeia de conexão no Azure chamada AZURE_COSMOS_CONNECTIONSTRING.". O Copilot pode oferecer-lhe uma sugestão de código semelhante à das etapas em Opção 2: sem GitHub Copilot abaixo e até sugerir que faça a alteração em app.js.

4. Abra app.js no explorador e adicione a sugestão de código no método getApp.

   O GitHub Copilot não lhe dá a mesma resposta sempre, pode ser necessário fazer mais perguntas para afinar a sua resposta. Para dicas, consulte O que posso fazer com o GitHub Copilot no meu codespace?.

5. De volta ao terminal do codespace, execute azd deploy.

   azd deploy
   

Sem o Copilot do GitHub

1. A partir do explorador, abra app.js e veja que a aplicação cria uma ligação Mongoose usando MONGODB_URI (Linha 16).

2. Altere process.env.MONGODB_URI para process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URI.

   Essa alteração torna possível escolher a variável de ambiente certa para a cadeia de conexão MongoDB, independentemente de você estar executando localmente ou no Azure. Pode usar o mesmo nome de variável para ambos os ambientes, mas isso está além do âmbito do tutorial.

3. De volta ao terminal do codespace, execute azd deploy.

   azd deploy
   

Sugestão

Pode também usar sempre azd up, que realiza todas as funções de azd package, azd provision e azd deploy.

A ter problemas? Consulte a secção de resolução de problemas.

5. Navegue para a app

1. Na saída AZD, localize a URL do seu aplicativo e navegue até ela no navegador. O URL tem esta aparência na saída AZD:

    Deploying services (azd deploy)
   
      (✓) Done: Deploying service web
      - Endpoint: <URL>
    

2. Adicione algumas tarefas à lista.

   

   Parabéns, você está executando um aplicativo Web no Serviço de Aplicativo do Azure, com conectividade segura ao Azure Cosmos DB.

A ter problemas? Consulte a secção de resolução de problemas.

6. Transmitir registos de diagnóstico

O Azure App Service captura todas as mensagens registadas no console para ajudá-lo a diagnosticar problemas com a sua aplicação. A aplicação de amostra gera mensagens de log no console em cada um dos seus endpoints para demonstrar esta capacidade. Por exemplo, o get endpoint emite uma mensagem sobre o número de tarefas recuperadas do banco de dados e uma mensagem de erro aparece caso algo corra mal.

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

No resultado do AZD, encontre o link para transmitir os registos do App Service e navegue até ele no navegador. O link tem esta aparência na saída AZD:

Stream App Service logs at: <URL>

Saiba mais sobre o registo em aplicações Java na série sobre Enable Azure Monitor OpenTelemetry for .NET, Node.js, Python and Java applications.

A ter problemas? Consulte a secção de resolução de problemas.

7. Limpar recursos

Para eliminar todos os recursos do Azure no ambiente de implementação atual, execute azd down e siga as instruções.

azd down

Solução de problemas

• A vista de implementação do portal para o Azure Cosmos DB mostra um estado de conflito
• A página do navegador da app implementada diz "Algo correu mal."

A vista de implementação do portal para o Azure Cosmos DB mostra um estado de Conflito

Dependendo da sua subscrição e da região que selecionar, poderá ver o estado da implementação do Azure Cosmos DB como Conflict, com a seguinte mensagem nos detalhes da operação:

Sorry, we are currently experiencing high demand in <region> region, and cannot fulfill your request at this time.

O erro é provavelmente causado por uma limitação no seu plano de subscrição para a região que selecionou. Tente escolher uma região diferente para a sua implementação.

A página do navegador do aplicativo implantado diz "Algo deu errado".

Provavelmente ainda precisa de fazer alterações na cadeia de ligação no código da sua aplicação. Ver 4. Implante o código de exemplo.

Perguntas frequentes

• Quanto custa esta configuração?
• Como posso conectar-me ao servidor Azure Cosmos DB, que está seguro atrás da rede virtual, utilizando outras ferramentas?
• Como funciona o desenvolvimento de aplicativos locais com o GitHub Actions?
• Por que a implantação do GitHub Actions é tão lenta?
• Não tenho permissões para criar uma identidade atribuída pelo utilizador
• O que posso fazer com o GitHub Copilot no meu ambiente de desenvolvimento?

Quanto custa esta configuração?

O preço dos recursos criados é o seguinte:

• O plano do Serviço de Aplicativos é criado na categoria Basic e pode ser ajustado para cima ou para baixo. Consulte preços de App Service.
• O servidor Azure Cosmos DB é criado em uma única região e pode ser distribuído para outras regiões. Veja preços do Azure Cosmos DB.
• A rede virtual não tem custo, a menos que configure funcionalidades adicionais, como o emparelhamento. Consulte Preços da Rede Virtual do Azure.
• A zona privada de DNS acarreta um pequeno custo. Consulte Preços do DNS do Azure.

Como posso conectar-me ao servidor do Azure Cosmos DB que está protegido atrás da rede virtual utilizando outras ferramentas?

• Para acesso básico a partir de uma ferramenta de linha de comando, pode executar mongosh a partir do terminal SSH da aplicação. O contentor da aplicação não vem com mongosh, pelo que deve instalá-lo manualmente. Lembre-se de que o cliente instalado não persiste após os reinícios da aplicação.
• Para ligar a partir de um cliente GUI do MongoDB, o seu computador deve estar dentro da rede virtual. Por exemplo, pode ser uma VM do Azure que está conectada a uma das sub-redes, ou uma máquina numa rede local que tem uma ligação de VPN site-a-site com a rede virtual do Azure.
• Para se conectar ao MongoDB shell a partir da página de gestão do Azure Cosmos DB no portal, a sua máquina também deve estar dentro da rede virtual. Poderia, em vez disso, abrir o firewall do servidor Azure Cosmos DB para o endereço IP da sua máquina local, mas isso aumenta a superfície de ataque da sua configuração.

Como funciona o desenvolvimento de aplicativos locais com o GitHub Actions?

Utilize o ficheiro de fluxo de trabalho gerado automaticamente pelo App Service como exemplo; cada git push inicia uma nova execução de compilação e implantação. A partir de um clone local do repositório GitHub, você faz com que as atualizações desejadas o enviem para o GitHub. Por exemplo:

git add .
git commit -m "<some-message>"
git push origin main

Por que é que a implantação das ações do GitHub é tão lenta?

O arquivo de fluxo de trabalho gerado automaticamente do Serviço de Aplicativo define a execução de dois trabalhos de compilação e implantação. Como cada tarefa é executada no seu próprio ambiente limpo, o ficheiro de fluxo de trabalho assegura que a tarefa deploy tem acesso aos ficheiros da tarefa build.

• No final do build trabalho, carregue os ficheiros como artefactos.
• No início da deploy tarefa, descarregue os artefatos.

A maior parte do tempo gasto pelo processo de dois trabalhos é passada a carregar e descarregar artefatos. Se quiser, pode simplificar o ficheiro de fluxo de trabalho ao combinar os dois trabalhos num só, o que elimina a necessidade dos passos de carregamento e descarga.

Não tenho permissões para criar uma identidade atribuída ao utilizador

Consulte Configurar a implementação do GitHub Actions a partir do Centro de Implementação.

O que posso fazer com o GitHub Copilot no meu espaço de código?

Poderá notar que a vista de chat do GitHub Copilot já estava disponível para si quando criou o codespace. Para sua conveniência, incluímos a extensão de chat do GitHub Copilot na definição de contêiner (consulte .devcontainer/devcontainer.json). No entanto, necessita de uma conta GitHub Copilot (teste gratuito de 30 dias disponível).

Algumas dicas para si quando fala com o GitHub Copilot:

• Numa única sessão de chat, as perguntas e respostas constroem umas sobre as outras e pode ajustar suas perguntas para aperfeiçoar a resposta que obtém.
• Por padrão, o GitHub Copilot não tem acesso a nenhum ficheiro no seu repositório. Para fazer perguntas sobre um ficheiro, abra primeiro o ficheiro no editor.
• Para permitir que o GitHub Copilot tenha acesso a todos os ficheiros no repositório ao preparar suas respostas, comece a sua pergunta com @workspace. Para obter mais informações, consulte Use the @workspace agent.
• Na sessão de chat, o GitHub Copilot pode sugerir alterações e (com @workspace) até mesmo indicar onde fazer as alterações, mas não tem permissão para fazer as alterações por si. Cabe a você adicionar as alterações sugeridas e testá-las.

Aqui estão algumas outras coisas que pode dizer para ajustar a resposta que obter:

• @workspace Onde é definido o MONGODB_URI?
• Em que ficheiro devo fazer a alteração?
• Vai esta alteração quebrar a minha aplicação quando executada localmente?

Próximos passos

JavaScript no centro de desenvolvedores do Azure

Configurar Node.js aplicativo no Serviço de Aplicativo

  Proteja com domínio e certificado personalizados