Eventos
17 de mar., 23 - 21 de mar., 23
Junte-se à série de encontros para criar soluções de IA escaláveis com base em casos de uso do mundo real com outros desenvolvedores e especialistas.
Registrar agoraNão há mais suporte para esse navegador.
Atualize o Microsoft Edge para aproveitar os recursos, o suporte técnico e as atualizações de segurança mais recentes.
Observação
A partir de 1º de junho de 2024, os aplicativos do Serviço de Aplicativo recém-criados podem gerar um nome de host padrão exclusivo que usa a convenção de nomenclatura <app-name>-<random-hash>.<region>.azurewebsites.net
. Os nomes de aplicativos existentes permanecem inalterados. Por exemplo:
myapp-ds27dh7271aah175.westus-01.azurewebsites.net
Para obter mais informações, confira Nome do host padrão exclusivo para o recurso do Serviço de Aplicativo.
Neste guia de início rápido, você vai aprender a criar e implantar seu primeiro aplicativo Web Node.js (Expresso) no Serviço de Aplicativo do Azure. O Serviço de Aplicativo é compatível com várias versões do Node.js no Linux e no Windows.
Este guia de início rápido configura um aplicativo do Serviço de Aplicativo na camada Gratuita e não gera cobranças na sua assinatura do Azure.
Este vídeo mostra como implantar um aplicativo Web Node.js no Azure.
As etapas no vídeo também são descritas nas seções a seguir.
node --version
para verificar se o Node.js está instalado.node --version
para verificar se o Node.js está instalado.node --version
para verificar se o Node.js está instalado.Nesta etapa, você vai criar um aplicativo Node.js básico e garante que ele é executado no computador.
Dica
Se você já tiver concluído o tutorial do Node.js, poderá pular para Implantar no Azure.
Crie um aplicativo Node.js usando o Gerador Expresso, que é instalado por padrão com o Node.js e o npm.
npx express-generator myExpressApp --view ejs
Se esta for a primeira vez que você instala o gerador, o npx solicitará que você concorde com a instalação.
Mude para o diretório do aplicativo e instale os pacotes npm.
cd myExpressApp && npm install
Atualize as dependências para a versão mais segura.
npm audit fix --force
Inicie o servidor de desenvolvimento com informações de depuração.
DEBUG=myexpressapp:* npm start
Em um navegador, navegue até http://localhost:3000
. Você deverá ver algo como:
Antes de continuar, verifique se você tem todos os pré-requisitos instalados e configurados.
Observação
Para executar o aplicativo Node.js no Azure, ele precisa escutar na porta fornecida pela variável de ambiente PORT
. No aplicativo Expresso gerado, essa variável de ambiente já é usada no script de inicialização bin/www. (Pesquise por process.env.PORT
).
No terminal, verifique se você está no diretório myExpressApp, depois inicie o Visual Studio Code usando o seguinte comando:
code .
No Visual Studio Code, na Barra de Atividade, selecione no logotipo do Azure.
No explorador Serviço de Aplicativo, selecione Entrar no Azure e siga as instruções.
No Visual Studio Code, você verá o endereço de email do Azure na Barra de Status e a sua assinatura no explorador Serviço de Aplicativo.
Clique com o botão direito do mouse nos Serviços de Aplicativos e selecione Criar novo Aplicativo Web. Um contêiner do Linux será usado por padrão.
Digite um nome global exclusivo para o aplicativo Web e selecione Enter. O nome precisa ser exclusivo em todo o Azure e usar somente caracteres alfanuméricos ('A-Z', 'a-z' e '0-9') e hifens ('-'). Confira a observação no início deste artigo.
Na opção Selecionar uma pilha de runtime, selecione a versão do Node.js de sua preferência. Uma versão LTS é recomendada.
Em Selecionar um tipo de preço, escolha Gratuito (F1) e aguarde até que os recursos sejam criados no Azure.
No pop-up Sempre implantar o workspace "myExpressApp" em <app-name>", selecioneSim. Fazendo isso, você garante que, enquanto estiver no mesmo workspace, o Visual Studio Code executará uma implantação no mesmo aplicativo do Serviço de Aplicativo todas as vezes.
Enquanto o Visual Studio Code cria os recursos do Azure e implanta o código, ele mostra as notificações do andamento.
Após a conclusão da implantação, clique em Procurar no site no pop-up de notificação. O navegador exibirá a página padrão do Expresso.
No terminal, verifique se você está no diretório myExpressApp, depois implante o código na pasta local (myExpressApp) usando o comando az webapp up:
az webapp up --sku F1 --name <app-name>
az
não for reconhecido, verifique se você tem a CLI do Azure instalada, conforme descrito em Configurar seu ambiente inicial.<app_name>
por um nome que seja exclusivo em todo o Azure. (Os caracteres válidos são a-z
, 0-9
e -
.) Confira a observação no início deste artigo. Um bom padrão é usar uma combinação do nome da empresa e um identificador de aplicativo.--sku F1
cria um aplicativo Web no tipo de preço Gratuito, que não gera cobranças.--location <location-name>
, em que <location_name>
é uma região do Azure disponível. Você pode recuperar uma lista de regiões permitidas para sua conta do Azure executando o comando az account list-locations
.--os-type
.O comando pode levar alguns minutos para ser concluído. Durante a execução, ele envia mensagens sobre como criar o grupo de recursos, o plano do Serviço de Aplicativo, o recurso de aplicativo, como configurar o registro em log, bem como executar a implantação Zip. Em seguida, ele fornece a mensagem "Você pode iniciar o aplicativo em http://<nome-do-aplicativo>.azurewebsites.net", que é a URL do aplicativo no Azure. (Confira a observação no início deste artigo).
The webapp '<app-name>' doesn't exist Creating Resource group '<group-name>' ... Resource group creation complete Creating AppServicePlan '<app-service-plan-name>' ... Creating webapp '<app-name>' ... Configuring default logging for the app, if not already enabled Creating zip with contents of dir /home/cephas/myExpressApp ... Getting scm site credentials for zip deployment Starting zip deployment. This operation can take a while to complete ... Deployment endpoint responded with status code 202 You can launch the app at http://<app-name>.azurewebsites.net { "URL": "http://<app-name>.azurewebsites.net", "appserviceplan": "<app-service-plan-name>", "location": "centralus", "name": "<app-name>", "os": "<os-type>", "resourcegroup": "<group-name>", "runtime_version": "node|10.14", "runtime_version_detected": "0.0", "sku": "FREE", "src_path": "//home//cephas//myExpressApp" }
Observação
O comando az webapp up
realiza as seguintes ações:
Criar um grupo de recursos padrão.
Criar um plano do Serviço de Aplicativo padrão.
Criar um aplicativo com o nome especificado.
Faça a implantação de zip de todos os arquivos do diretório de trabalho atual, com a automação de build habilitada.
Armazene em cache os parâmetros localmente no arquivo .azure/config para que você não precise especificá-los novamente na implantação posterior com az webapp up
ou outros comandos az webapp
da pasta do projeto. Os valores armazenados em cache são usados automaticamente por padrão.
Entre no portal do Azure.
Para começar a criar um aplicativo Node.js, navegue até https://portal.azure.com/#create/Microsoft.WebSite.
Na guia Básico, em Detalhes do Projeto, verifique se a assinatura correta está selecionada e, em seguida, selecione Criar novo para criar um grupo de recursos. Digite myResourceGroup para o nome.
Em Detalhes da instância, digite um nome global exclusivo para o aplicativo Web e selecione Código. (Confira a observação no início deste artigo). Selecione Nó 18 LTS na Pilha de runtime, escolha um Sistema Operacional e uma Região de onde você deseja disponibilizar seu aplicativo.
Em Plano do Serviço de Aplicativo, selecione Criar novo para criar um Plano do Serviço de Aplicativo. Digite myAppServicePlan para o nome. Para alterar para a Camada gratuita, selecione Alterar tamanho, selecione a guia Desenvolvimento/Teste, selecione F1 e, em seguida, selecione o botão Aplicar na parte inferior da página.
Selecione o botão Examinar + criar na parte inferior da página.
Após a execução da validação, selecione o botão Criar na parte inferior da página.
Após a conclusão da implantação, selecione Ir para o recurso.
Depois que o Serviço de Aplicativo do Azure dá suporte a dois tipos de credenciais para a implantação local de FTP/S. Essas credenciais não são iguais às suas credenciais de assinatura do Azure. Nesta seção, você obtém as credenciais de escopo do aplicativo para usar com o FileZilla.
Na página aplicativo do Serviço de Aplicativo, selecione Centro de Implantação no menu à esquerda e, em seguida, selecione a guia Credenciais de FTPS.
Abra o FileZilla e crie um site.
Na guia Credenciais FTPS, copie o Ponto de extremidade FTPS, o Nome de usuário e a Senha no FileZilla.
Selecione Conectar no FileZilla.
Copie todos os arquivos de diretórios e arquivos para o diretório /site/wwwroot no Azure.
Navegue até a URL do aplicativo para verificar se ele está sendo executado corretamente.
É possível implantar alterações nesse aplicativo executando edições no Visual Studio Code, salvando os arquivos, depois reimplantando no aplicativo do Azure. Por exemplo:
No projeto de exemplo, abra exibição/index.ejs, depois execute uma alteração
<p>Welcome to <%= title %></p>
até
<p>Welcome to Azure</p>
No explorador Serviço de Aplicativo, selecione novamente o ícone Implantar no Aplicativo Web, depois confirme mais uma vez selecionando Implantar.
Aguarde a conclusão da implantação, depois clique em Procurar no site no pop-up de notificação. Você verá que a mensagem Welcome to Express
foi alterada para Welcome to Azure
.
Salve as alterações, depois reimplante o aplicativo usando novamente o comando az webapp up sem argumentos para Linux. Adicione --os-type Windows
para Windows:
az webapp up
Esse comando usa valores armazenados em cache localmente no arquivo .azure/config, incluindo: nome do aplicativo, grupo de recursos e plano do Serviço de Aplicativo.
Após a conclusão da implantação, atualize a página da Web http://<app-name>.azurewebsites.net
. (Confira a observação no início deste artigo). Você verá que a mensagem Welcome to Express
foi alterada para Welcome to Azure
.
Salve as alterações e, em seguida, reimplante o aplicativo usando seu cliente FTP.
Após a conclusão da implantação, atualize a página da Web http://<app-name>.azurewebsites.net
. (Confira a observação no início deste artigo). Você verá que a mensagem Welcome to Express
foi alterada para Welcome to Azure
.
É possível transmitir por streaming a saída do log (chamadas ao console.log()
) do aplicativo Azure diretamente na janela de saída do Visual Studio Code.
No explorador Serviço de Aplicativo, clique com o botão direito do mouse na opção nó do aplicativo, depois selecione Iniciar Logs de Streaming.
Caso receba uma solicitação para reiniciar o aplicativo, selecione Sim. Quando o aplicativo reiniciar, a janela de saída do Visual Studio Code será aberta exibindo uma conexão com o fluxo de log.
Após alguns segundos, a Janela de Saída mostrará uma mensagem indicando que você está conectado ao serviço de streaming de log. Gere mais atividades de saída atualizando a página no navegador.
Connecting to log stream... 2020-03-04T19:29:44 Welcome, you are now connected to log-streaming service. The default timeout is 2 hours. Change the timeout with the App Setting SCM_LOGSTREAM_TIMEOUT (in seconds).
Você pode acessar os logs do console gerados de dentro do aplicativo e do contêiner no qual ele é executado. Os logs incluem todas as saídas geradas por chamadas ao console.log()
.
Para transmitir logs, execute o comando az webapp log tail:
az webapp log tail
O comando usa o nome do grupo de recursos armazenado em cache no arquivo .azure/config.
Você também pode incluir o parâmetro --logs
com o comando az webapp up para abrir automaticamente o fluxo de log na implantação.
Atualize o aplicativo no navegador para gerar logs de console, que incluem mensagens que descrevem solicitações HTTP para o aplicativo. Se nenhuma saída for exibida imediatamente, tente novamente em 30 segundos.
Para interromper o streaming de log a qualquer momento, selecione CTRL+C no terminal.
Você pode acessar os logs do console gerados de dentro do aplicativo e do contêiner no qual ele é executado. É possível transmitir por streaming a saída do log (chamadas ao console.log()
) do aplicativo Node.js diretamente no portal do Azure.
Na mesma página do Serviço de Aplicativo para o seu aplicativo, use o menu à esquerda para rolar até a seção Monitoramento e selecione Fluxo de log.
Após alguns segundos, a Janela de Saída mostrará uma mensagem indicando que você está conectado ao serviço de streaming de log. Gere mais atividades de saída atualizando a página no navegador.
Connecting... 2021-10-26T21:04:14 Welcome, you are now connected to log-streaming service. Starting Log Tail -n 10 of existing logs ---- /appsvctmp/volatile/logs/runtime/81b1b83b27ea1c3d598a1cdec28c71c4074ce66c735d0be57f15a8d07cb3178e.log 2021-10-26T21:04:08.614384810Z: [INFO] 2021-10-26T21:04:08.614393710Z: [INFO] # Enter the source directory to make sure the script runs where the user expects 2021-10-26T21:04:08.614399010Z: [INFO] cd "/home/site/wwwroot" 2021-10-26T21:04:08.614403210Z: [INFO] 2021-10-26T21:04:08.614407110Z: [INFO] export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH 2021-10-26T21:04:08.614411210Z: [INFO] if [ -z "$PORT" ]; then 2021-10-26T21:04:08.614415310Z: [INFO] export PORT=8080 2021-10-26T21:04:08.614419610Z: [INFO] fi 2021-10-26T21:04:08.614423411Z: [INFO] 2021-10-26T21:04:08.614427211Z: [INFO] node /opt/startup/default-static-site.js Ending Log Tail of existing logs ---
Nas etapas anteriores, você criou os recursos do Azure em um grupo de recursos. As etapas deste guia de início rápido inserem todos os recursos nesse grupo de recursos. Basta remover o grupo de recursos para limpar.
Na extensão do Azure do Visual Studio, expanda o explorador Grupos de Recursos.
Expanda a assinatura, clique com o botão direito do mouse no grupo de recursos criado anteriormente, depois clique em Excluir.
Quando solicitado, confirme a exclusão inserindo o nome do grupo de recursos que você está excluindo. Ao confirmar, o grupo de recursos será excluído e você receberá uma notificação após a conclusão.
Nas etapas anteriores, você criou os recursos do Azure em um grupo de recursos. O grupo de recursos tem um nome como "appsvc_rg_Linux_CentralUS", dependendo da sua localização.
Se você achar que não precisará desses recursos no futuro, exclua o grupo de recursos executando o seguinte comando:
az group delete --no-wait
O comando usa o nome do grupo de recursos armazenado em cache no arquivo .azure/config.
O argumento --no-wait
permite que o comando seja retornado antes que a operação seja concluída.
Você pode excluir o grupo de recursos, o serviço de aplicativo e todos os recursos relacionados quando não forem mais necessários.
Na página Visão geral do Serviço de Aplicativo, selecione grupo de recursos que você criou na etapa Criar recursos do Azure.
Na página Grupo de recursos, selecione Excluir grupo de recursos. Confirme o nome do grupo de recursos terminar de excluir os recursos.
Parabéns, você concluiu com êxito este início rápido!
Confira as outras extensões do Azure.
Ou obtenha todas elas instalando o pacote de extensão Pacote de Nós para Azure.
Eventos
17 de mar., 23 - 21 de mar., 23
Junte-se à série de encontros para criar soluções de IA escaláveis com base em casos de uso do mundo real com outros desenvolvedores e especialistas.
Registrar agoraTreinamento
Roteiro de aprendizagem
Roteiro de aprendizagem "Implantar um site no Azure com o Serviço de Aplicativo do Azure" - Training
Neste roteiro de aprendizagem, familiarize-se com o uso do Serviço de Aplicativo do Azure para criar e implantar seu site sem servidores subjacentes, armazenamento nem ativos de rede.
Certificação
Microsoft Certified: Azure Developer Associate - Certifications
Crie soluções de ponta a ponta no Microsoft Azure para criar Funções do Azure, implementar e gerenciar aplicativos Web, desenvolver soluções utilizando o Armazenamento do Microsoft Azure e muito mais.
Documentação
Implantar um aplicativo Node.js + MongoDB no Azure - Azure App Service
Este artigo mostra que você precisa implantar um aplicativo Node.js usando Express.js e um banco de dados MongoDB no Azure. O Serviço de Aplicativo do Azure é usado para hospedar o aplicativo Web, e o Azure Cosmos DB é usado para hospedar o banco de dados usando a API do MongoDB 100% compatível interna ao Azure Cosmos DB.
Configurar aplicativos Node.js - Azure App Service
Saiba como configurar um aplicativo Node.js nas instâncias nativas do Windows ou em um contêiner Linux predefinido no Serviço de Aplicativo do Azure. Este artigo mostra as tarefas de configuração mais comuns.
Criar e implantar um aplicativo Node.js Express para Serviço de Nuvem do Azure (clássico)
Use este tutorial para criar um novo aplicativo usando o módulo Express, que fornece uma estrutura MVC (Model-View-Control) para criar aplicativos Web Node.js.