Oktatóanyag: Rendszerképadatok feltöltése a felhőbe az Azure Storage használatával

Ez az oktatóanyag egy sorozat első része. Ez az oktatóanyag bemutatja, hogyan helyezhet üzembe egy webalkalmazást. A webalkalmazás a Azure Blob Storage ügyféloldali kódtár használatával tölt fel képeket egy tárfiókba. Ha végzett, egy webalkalmazással fog elkészülni, amely az Azure Storage-ból származó képeket tárolja és jeleníti meg.

A sorozat első részében a következőkkel ismerkedhet meg:

  • Tárfiók létrehozása
  • Tároló létrehozása és az engedélyek beállítása
  • Hozzáférési kulcs lekérése
  • Webalkalmazás üzembe helyezése az Azure-ban
  • Alkalmazásbeállítások konfigurálása
  • A webalkalmazás használata

Előfeltételek

Az oktatóanyag elvégzéséhez szüksége lesz egy Azure-előfizetésre. Mielőtt hozzákezd, hozzon létre egy ingyenes fiókot.

Az Azure Cloud Shell használata

Az Azure által üzemeltetett Azure Cloud Shell egy interaktív felület, amelyet a böngészőből használhat. A Bash vagy a PowerShell segítségével is használhatja a Cloud Shellt az Azure-szolgáltatásokhoz. Az ebben a cikkben található kódot a Cloud Shell előtelepített parancsaival is futtathatja, így semmit nem kell a helyi környezetben telepítenie.

Az Azure Cloud Shell indítása:

Beállítás Példa/hivatkozás
Kattintson a Kipróbálás elemre egy kódblokk jobb felső sarkában. A Kipróbálás lehetőségre kattintással nem másolja a kódot automatikusan a Cloud Shellbe. Példa az Azure Cloud Shell Kipróbálás lehetőségére
Látogasson el a https://shell.azure.com webhelyre, vagy kattintson a Cloud Shell indítása gombra a böngészőben. A Cloud Shell indítása új ablakban
Az Azure Portal jobb felső sarkában található menüben kattintson a Cloud Shell gombra. Cloud Shell gomb a Microsoft Azure Portal-on

Az ebben a cikkben szereplő kód Azure Cloud Shellben való futtatásához:

  1. Indítsa el a Cloud Shellt.

  2. A kód másolásához válassza az adott kódblokkhoz tartozó Másolás gombot.

  3. Illessze be a kódot a Cloud Shell-munkamenetbe a Ctrl+Shift+V billentyűkombinációval Windows és Linux rendszeren, vagy a Cmd+Shift+V billentyűkombinációval macOS rendszeren.

  4. A kód futtatásához nyomja le az Enter billentyűt.

A CLI helyi telepítéséhez és használathoz futtassa az Azure CLI 2.0.4-es vagy újabb verzióját. A verzió azonosításához futtassa a következőt: az --version. Ha telepíteni vagy frissíteni szeretne, olvassa el az Azure CLI telepítését ismertető cikket.

Erőforráscsoport létrehozása

A következő példában létrehozunk egy myResourceGroup nevű erőforráscsoportot.

Hozzon létre egy erőforráscsoportot a New-AzResourceGroup paranccsal. Az Azure-erőforráscsoport olyan logikai tároló, amelybe a rendszer üzembe helyezi és kezeli az Azure-erőforrásokat.

New-AzResourceGroup -Name myResourceGroup -Location southeastasia

Tárfiók létrehozása

A minta képeket tölt fel egy Azure-tárfiókban lévő blobtárolóba. A tárfiók egy egyedi névteret biztosít az Azure Storage-adatobjektumok tárolásához és hozzáféréséhez.

Fontos

Az oktatóanyag 2. részében az Azure Event Grid blobtárolóval használja. Mindenképpen olyan Azure-régióban hozza létre a tárfiókot, amely támogatja a Event Grid. A támogatott régiók listáját lásd: Azure-termékek régiónként.

A következő parancsban cserélje le a saját globálisan egyedi nevét arra a Blob Storage-fiókra, ahol a <blob_storage_account> helyőrző látható.

Hozzon létre egy tárfiókot a létrehozott erőforráscsoportban a New-AzStorageAccount paranccsal.

$blobStorageAccount="<blob_storage_account>"

New-AzStorageAccount -ResourceGroupName myResourceGroup -Name $blobStorageAccount -SkuName Standard_LRS -Location southeastasia -Kind StorageV2 -AccessTier Hot

Blob Storage-tárolók létrehozása

Az alkalmazás két tárolót használ a Blob Storage-fiókban. A tárolók hasonlóak a mappákhoz és a tárolóblobokhoz. A képek tároló az a hely, ahová az alkalmazás feltölti a teljes felbontású képeket. A sorozat egy későbbi részében egy Azure-függvényalkalmazás feltölti az átméretezett kép miniatűrjeit a *miniatűrbe

Az images tároló nyilvános hozzáférése a következőre van beállítva: off . A thumbnails tároló nyilvános hozzáférése a következőre van beállítva: container . A nyilvános hozzáférés beállítása lehetővé teszi a weblapot meglátogató felhasználók container számára a miniatűrök megtekintését.

Szerezze be a tárfiókkulcsot a Get-AzStorageAccountKey paranccsal. Ezután ezzel a kulccsal hozzon létre két tárolót a New-AzStorageContainer paranccsal.

$blobStorageAccountKey = (Get-AzStorageAccountKey -ResourceGroupName myResourceGroup -Name $blobStorageAccount).Key1
$blobStorageContext = New-AzStorageContext -StorageAccountName $blobStorageAccount -StorageAccountKey $blobStorageAccountKey

New-AzStorageContainer -Name images -Context $blobStorageContext
New-AzStorageContainer -Name thumbnails -Permission Container -Context $blobStorageContext

Jegyezze fel a Blob Storage-fiók nevét és kulcsát. A mintaalkalmazás ezekkel a beállításokkal csatlakozik a tárfiókhoz a képek feltöltéséhez.

App Service-csomag létrehozása

Az alkalmazást tároló webkiszolgálófarm helyét, méretét és funkcióit egy App Service-csomag határozza meg.

Az alábbi példa egy myAppServicePlan nevű App Service-csomag létrehozását mutatja be az INGYENES tarifacsomagban:

Hozzon létre egy App Service a New-AzAppServicePlan paranccsal.

New-AzAppServicePlan -ResourceGroupName myResourceGroup -Name myAppServicePlan -Tier "Free"

Webalkalmazás létrehozása

A webalkalmazás üzemeltetési helyet biztosít a GitHub-mintaadattárból üzembe helyezett mintaalkalmazás kódjában.

A következő parancsban cserélje le <web_app> a helyére az egyedi nevet. Érvényes karakterek: a-z, 0-9 és -. Ha a nem egyedi, a következő hibaüzenet jelenik <web_app> meg: A megadott nevű webhely <web_app> már létezik. A webalkalmazás alapértelmezett URL-címe https://<web_app>.azurewebsites.net.

Hozzon létre egy webalkalmazást a myAppServicePlan App Service a New-AzWebApp paranccsal.

$webapp="<web_app>"

New-AzWebApp -ResourceGroupName myResourceGroup -Name $webapp -AppServicePlan myAppServicePlan

Mintaalkalmazás üzembe helyezése a GitHub-adattárból

Az App Service több módszert is támogat tartalmak webalkalmazásba való üzembe helyezésére. Ebben az oktatóanyagban a webalkalmazást egy nyilvános GitHub-mintaadattárból telepítheti. Konfigurálja a GitHubról való telepítést a webalkalmazásba az az webapp deployment source config parancs segítségével.

A mintaprojekt egy MVC ASP.NET tartalmaz. Az alkalmazás elfogad egy képet, menti azt egy tárfiókba, és megjeleníti a miniatűrtárolóból származó képeket. A webalkalmazás az Azure.Storage, az Azure.Storage.Blobsés az Azure.Storage.Blobs.Models névtereket használja az Azure Storage szolgáltatással való interakcióhoz.

az webapp deployment source config --name $webapp --resource-group myResourceGroup \
  --branch master --manual-integration \
  --repo-url https://github.com/Azure-Samples/storage-blob-upload-from-webapp
az webapp deployment source config --name $webapp --resource-group myResourceGroup `
  --branch master --manual-integration `
  --repo-url https://github.com/Azure-Samples/storage-blob-upload-from-webapp

A webalkalmazás beállításainak konfigurálása

A minta-webalkalmazás a .NET-hez használható Azure Storage API-kat használja a képek feltöltéséhez. A tárfiók hitelesítő adatai a webalkalmazás alkalmazásbeállításai között vannak beállítva. Adja hozzá az alkalmazásbeállításokat az üzembe helyezett alkalmazáshoz az az webapp config appsettings set vagy a New-AzStaticWebAppSetting paranccsal.

az webapp config appsettings set --name $webapp --resource-group myResourceGroup \
  --settings AzureStorageConfig__AccountName=$blobStorageAccount \
    AzureStorageConfig__ImageContainer=images \
    AzureStorageConfig__ThumbnailContainer=thumbnails \
    AzureStorageConfig__AccountKey=$blobStorageAccountKey
az webapp config appsettings set --name $webapp --resource-group myResourceGroup `
  --settings AzureStorageConfig__AccountName=$blobStorageAccount `
    AzureStorageConfig__ImageContainer=images `
    AzureStorageConfig__ThumbnailContainer=thumbnails `
    AzureStorageConfig__AccountKey=$blobStorageAccountKey

A webalkalmazás üzembe helyezése és konfigurálása után tesztelheti a képfeltöltési funkciót az alkalmazásban.

Rendszerkép feltöltése

A webalkalmazás teszteléséhez nyissa meg a közzétett alkalmazás URL-címét. A webalkalmazás alapértelmezett URL-címe https://<web_app>.azurewebsites.net.

Válassza a Fényképek feltöltése régiót egy fájl megadásához és feltöltéshez, vagy húzza a fájlt a régióba. Sikeres feltöltés esetén a kép eltűnik. A Létrehozott miniatűrök szakasz üres marad, amíg az oktatóanyag későbbi részében teszteljük.

Fényképek feltöltése a .NET-en

A mintakódban a UploadFileToStorage Storagehelper.cs fájlban található feladattal töltheti fel a képeket a tárfiók images tárolójára az UploadAsync metódussal. A következő mintakód tartalmazza a UploadFileToStorage műveletet.

public static async Task<bool> UploadFileToStorage(Stream fileStream, string fileName,
                                                    AzureStorageConfig _storageConfig)
{
    // Create a URI to the blob
    Uri blobUri = new Uri("https://" +
                          _storageConfig.AccountName +
                          ".blob.core.windows.net/" +
                          _storageConfig.ImageContainer +
                          "/" + fileName);

    // Create StorageSharedKeyCredentials object by reading
    // the values from the configuration (appsettings.json)
    StorageSharedKeyCredential storageCredentials =
        new StorageSharedKeyCredential(_storageConfig.AccountName, _storageConfig.AccountKey);

    // Create the blob client.
    BlobClient blobClient = new BlobClient(blobUri, storageCredentials);

    // Upload the file
    await blobClient.UploadAsync(fileStream);

    return await Task.FromResult(true);
}

Az előző feladatban használt osztályok és módszerek a következők:

Osztály Módszer
Uri URI konstruktor
StorageSharedKeyCredential StorageSharedKeyCredential(Sztring, Sztring) konstruktor
BlobClient UploadAsync (Async feltöltése)

Ellenőrizze, hogy a kép megjelenik-e a tárfiókban

Jelentkezzen be az Azure Portalra. A bal oldali menüben válassza a Tárfiókok lehetőséget, majd válassza ki saját tárfiókja nevét. Válassza a Tárolók lehetőséget, majd válassza ki az images tárolót.

Ellenőrizze, hogy a kép megjelenik-e a tárolóban.

Azure Portal rendszerképek tároló listázása

Miniatűr megtekintésének tesztelése

A miniatűrök megtekintésének teszteléséhez feltölt egy képet a thumbnails tárolóba, és ellenőrzi, hogy az alkalmazás be tudja-e olvasni a thumbnails tárolót.

Jelentkezzen be az Azure Portalra. A bal oldali menüben válassza a Tárfiókok lehetőséget, majd válassza ki saját tárfiókja nevét. Válassza a Tárolók lehetőséget, majd a thumbnails tárolót. Válassza a Feltöltés lehetőséget a Blob feltöltése panel megnyitásához.

Válasszon ki egy fájlt a fájlválasztóval, majd válassza a Feltöltés lehetőséget.

Lépjen vissza az alkalmazásba és ellenőrizze, hogy a thumbnails tárolóba feltöltött kép látható-e.

A sorozat második részében automatizálhatja a miniatűrök létrehozását, így nincs szüksége erre a képre. A thumbnails tárolóban válassza ki a feltöltött képet, majd válassza a Törlés lehetőséget a kép eltávolításához.

Engedélyezheti, hogy Content Delivery Network (CDN) gyorsítótárazza az Azure-tárfiók tartalmát. További információ: Azure Storage-fiók integrálása a Azure CDN.

Következő lépések

A sorozat első részében megtanulta, hogyan konfigurálhat egy webalkalmazást a tárolóval való interakcióhoz.

A sorozat második részében megtudhatja, hogyan aktiválhat Event Grid egy Azure-függvényt egy kép átméretezésére.