1. lépés: Képadatok feltöltése a felhőbe az Azure Storage használatával
Ez az oktatóanyag egy sorozat első része. Ebben az oktatóanyagban megtudhatja, hogyan helyezhet üzembe webalkalmazásokat. A webalkalmazás az Azure Blob Storage ügyfélkódtárával tölt fel képeket egy tárfiókba.
A sorozat első részében a következő feladatokat hajtja végre:
- 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ákezdene, hozzon létre egy ingyenes fiókot .
Azure Cloud Shell
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. A Cloud Shell előre telepített parancsaival futtathatja a jelen cikkben szereplő kódot anélkül, hogy bármit telepítenie kellene a helyi környezetben.
Az Azure Cloud Shell indítása:
| Lehetőség | Példa/hivatkozás |
|---|---|
| Válassza a Kipróbálás lehetőséget egy kód vagy parancsblokk jobb felső sarkában. A Kipróbálás lehetőség választása nem másolja automatikusan a kódot vagy a parancsot a Cloud Shellbe. |  |
| Látogasson el a https://shell.azure.com webhelyre, vagy kattintson a Cloud Shell indítása gombra a böngészőben. |  |
| Az Azure Portal jobb felső sarkában található menüben kattintson a Cloud Shell gombra. |  |
Az Azure Cloud Shell használata:
Indítsa el a Cloud Shellt.
A kód vagy parancs másolásához kattintson a Másolás gombra egy kódblokkon (vagy parancsblokkon).
Illessze be a kódot vagy parancsot a Cloud Shell-munkamenetbe a Windows és Linux rendszeren a Ctrl Shift+V billentyűkombinációval+, vagy a Cmd+Shift+V macOS rendszeren való kiválasztásával.
A kód vagy parancs futtatásához válassza az Enter lehetőséget .
Erőforráscsoport létrehozása
Fontos
Az oktatóanyag 2. lépésében az Azure Event Gridet használja az ebben a lépésben létrehozott blobtárolóval. Hozza létre a tárfiókot egy Olyan Azure-régióban, amely támogatja az Event Gridet. A támogatott régiók listájáért tekintse meg az Azure-termékek régiónkénti listáját.
Az Azure Cloud Shellben válassza a Bal felső sarokban található Bash elemet, ha még nincs kijelölve.
Hozzon létre egy erőforráscsoportot az az group create paranccsal. Az Azure-erőforráscsoport olyan logikai tároló, amelybe a rendszer üzembe helyezi és kezeli az Azure-erőforrásokat.
Feljegyzés
Állítsa be a megfelelő értékeket az
regionésrgName(erőforráscsoport neve) számára.region="eastus" rgName="egridtutorialrg" az group create --name $rgName --location $region
Tárfiók létrehozása
A minta képeket tölt fel egy Azure Storage-fiók blobtárolójába.
Az az storage account create paranccsal hozzon létre egy tárfiókot a létrehozott erőforráscsoportban.
blobStorageAccount="myblobstorage$RANDOM"
az storage account create --name $blobStorageAccount --location $region \
--resource-group $rgName --sku Standard_LRS --kind StorageV2 --access-tier hot --allow-blob-public-access true
Blob Storage-tárolók létrehozása
Az alkalmazás két tárolót használ a Blob Storage-fiókban. A képek tároló az a hely, ahová az alkalmazás feltölti a teljes felbontású képeket. A sorozat második lépésében egy Azure-függvényalkalmazás feltölti az átméretezett kép miniatűrjeit a miniatűrök tárolójára.
A lemezképtároló nyilvános hozzáférése a következőre offvan állítva: . A miniatűrök tárolójának nyilvános hozzáférése a következőre containervan állítva: . A container nyilvános hozzáférési beállítás lehetővé teszi a weblapot látogató felhasználók számára a miniatűrök megtekintését.
Szerezze be a tárfiókkulcsot az az storage account keys list parancs segítségével. Ezután ezzel a kulccsal hozzon létre két tárolót az az storage container create paranccsal.
blobStorageAccountKey=$(az storage account keys list -g $rgName \
-n $blobStorageAccount --query "[0].value" --output tsv)
az storage container create --name images \
--account-name $blobStorageAccount \
--account-key $blobStorageAccountKey
az storage container create --name thumbnails \
--account-name $blobStorageAccount \
--account-key $blobStorageAccountKey --public-access container
A mintaalkalmazás a saját nevével és hozzáférési kulcsával csatlakozik a tárfiókhoz.
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-csomagot az az appservice plan create paranccsal.
planName="MyAppServicePlan"
az appservice plan create --name $planName --resource-group $rgName --sku Free
Webalkalmazás létrehozása
A webalkalmazás tárhelyet biztosít a GitHub-mintaadattárból üzembe helyezett mintaalkalmazás-kódhoz.
Az az webapp create paranccsal hozzon létre egy webalkalmazást a myAppServicePlan App Service-csomagban.
webapp="mywebapp$RANDOM"
az webapp create --name $webapp --resource-group $rgName --plan $planName
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 ASP.NET MVC-alkalmazást tartalmaz. Az alkalmazás elfogad egy képet, menti azt egy tárfiókba, és képeket jelenít meg egy miniatűr tárolóból. 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 $rgName \
--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 készült 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ásaiban vannak beállítva. Alkalmazásbeállítások hozzáadása az üzembe helyezett alkalmazáshoz az az webapp config appsettings set vagy New-AzStaticWebAppSetting paranccsal.
az webapp config appsettings set --name $webapp --resource-group $rgName \
--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. Ezután válassza ki a Fényképek feltöltése régiót egy fájl megadásához és feltöltéséhez, 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 nem teszteljük.
Feljegyzés
Futtassa a következő parancsot a webalkalmazás nevének lekéréséhez: echo $webapp
A mintakódban a rendszer a UploadFileToStorageStoragehelper.cs fájlban lévő feladatot használja a rendszerképek feltöltésére a tárfiókban lévő lemezképtárolóba az UploadAsync metódus használatával. 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 | Metódus |
|---|---|
| Uri | Uri konstruktor |
| StorageSharedKeyCredential | StorageSharedKeyCredential(Sztring, Sztring) konstruktor |
| BlobClient | UploadAsync |
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.
Feljegyzés
Futtassa a következőt a tárfiók nevének lekéréséhez:
echo $blobStorageAccount.A bal oldali menü Adattárolás szakaszában válassza a Tárolók lehetőséget.
Válassza ki a képek blobtárolót.
Ellenőrizze, hogy a kép megjelenik-e a tárolóban.
Miniatűr megtekintésének tesztelése
A miniatűrök megtekintésének teszteléséhez feltölt egy képet a miniatűrök tárolóba annak ellenőrzéséhez, hogy az alkalmazás képes-e olvasni a miniatűrök tárolójá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 válassza ki a miniatűrök 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, és 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űrképek létrehozását, hogy ne legyen szüksége erre a képre. A miniatűrök tárolójában válassza ki a feltöltött képet, majd a Törlés gombra kattintva távolítsa el a képet.