Skapa en statisk HTML-webbapp i Azure
Azure App Service ger en mycket skalbar webbvärdtjänst med självkorrigering. Den här snabbstarten visar hur du distribuerar en enkel HTML+CSS-webbplats till Azure App Service. Du kommer att slutföra den här snabbstarten i Cloud Shell, men du kan också köra dessa kommandon lokalt med Azure CLI.
Anteckning
Information om hur du hanterar statiska HTML-filer i en serverlös miljö finns i Static Web Apps.
Om du inte har en Azure-prenumeration skapar du ett kostnadsfritt Azure-konto innan du börjar.
Förutsättningar
Använd Bash-miljön i Azure Cloud Shell. Mer information finns i Snabbstart för Bash i Azure Cloud Shell.
Om du föredrar att köra CLI-referenskommandon lokalt installerar du Azure CLI. Om du kör i Windows eller macOS kan du köra Azure CLI i en Docker-container. Mer information finns i Så här kör du Azure CLI i en Docker-container.
Om du använder en lokal installation loggar du in på Azure CLI med hjälp av kommandot az login. Slutför autentiseringsprocessen genom att följa stegen som visas i terminalen. Andra inloggningsalternativ finns i Logga in med Azure CLI.
När du uppmanas att göra det installerar du Azure CLI-tillägget vid första användningen. Mer information om tillägg finns i Använda tillägg med Azure CLI.
Kör az version om du vill hitta versionen och de beroende bibliotek som är installerade. Om du vill uppgradera till den senaste versionen kör du az upgrade.
Ladda ned exemplet
Skapa en snabbstartskatalog i Cloud Shell och ändra sedan till den.
mkdir quickstart
cd $HOME/quickstart
Kör sedan följande kommando för att klona lagringsplatsen för exempelprogrammet till din snabbstartskatalog.
git clone https://github.com/Azure-Samples/html-docs-hello-world.git
Skapa en webbapp
Ändra till katalogen som innehåller exempelkoden och kör kommandot az webapp up . I följande exempel ersätter <du app_name> med ett unikt appnamn. Statiskt innehåll indikeras av --html flaggan.
cd html-docs-hello-world
az webapp up --location westeurope --name <app_name> --html
Anteckning
Om du vill vara värd för ditt statiska innehåll på en Linux-baserad App Service-instans konfigurerar du PHP som din körning med hjälp av flaggorna --runtime och--os-type:
az webapp up --location westeurope --name <app_name> --runtime "PHP:8.1" --os-type linux
PHP-containern innehåller en webbserver som är lämplig som värd för statiskt HTML-innehåll.
Kommandot az webapp up utför följande åtgärder:
Skapa en standardresursgrupp.
Skapa en standard App Service-plan.
Skapa ett program med det givna namnet.
Zip-distribuera filer från den aktuella arbetskatalogen till webbprogrammet.
Det kan ett par minuter att köra kommandot. Medan det körs visas information liknande den i följande exempel:
{
"app_url": "https://<app_name>.azurewebsites.net",
"location": "westeurope",
"name": "<app_name>",
"os": "Windows",
"resourcegroup": "appsvc_rg_Windows_westeurope",
"serverfarm": "appsvc_asp_Windows_westeurope",
"sku": "FREE",
"src_path": "/home/<username>/quickstart/html-docs-hello-world ",
< JSON data removed for brevity. >
}
Anteckna resourceGroup-värdet. Du behöver den för avsnittet rensa resurser.
Bläddra till appen
Gå till appens URL i en webbläsare: http://<app_name>.azurewebsites.net.
Sidan körs som en Azure App Service-webbapp.
Grattis! Du har distribuerat din första HTML-app till App Service.
Uppdatera och distribuera om appen
I Cloud Shell skriver du nano index.html för att öppna nanotextredigerare. I rubriktaggen <h1> ändrar du "Azure App Service – Sample Static HTML Site" till "Azure App Service" enligt nedan.
Spara dina ändringar och avsluta nano. Använd kommandot ^O för att spara och ^X för att avsluta.
Du kan nu distribuera appen med samma az webapp up-kommando.
az webapp up --location westeurope --name <app_name> --html
När distributionen är klar går du tillbaka till webbläsarfönstret som öppnades när du skulle söka efter appen och klickar på knappen för att uppdatera sidan.
Hantera din nya Azure-app
Om du vill hantera webbappen som du skapade i Azure Portal söker du efter och väljer App Services.
På sidan App Services väljer du namnet på din Azure-app.
Nu visas sidan Översikt för din webbapp. Här kan du utföra grundläggande hanteringsåtgärder som att bläddra, stoppa, starta, starta om och ta bort.
Menyn till vänster innehåller olika sidor för att konfigurera appen.
Rensa resurser
I de föregående stegen skapade du Azure-resurser i en resursgrupp. Om du inte tror att du behöver dessa resurser i framtiden tar du bort resursgruppen genom att köra följande kommando i Cloud Shell. Kom ihåg att resursgruppens namn har genererats automatiskt för dig i steget skapa en webbapp.
az group delete --name appsvc_rg_Windows_westeurope
Det kan några minuter att köra kommandot.