Hostowanie statycznej witryny internetowej w usłudze Azure Storage

Zawartość statyczną (pliki HTML, CSS, JavaScript i image) można udostępniać bezpośrednio z kontenera na koncie ogólnego przeznaczenia w wersji 2 lub BlockBlobStorage . Aby dowiedzieć się więcej, zobacz Hostowanie statycznej witryny internetowej w usłudze Azure Storage.

W tym artykule pokazano, jak włączyć hostowanie statycznej witryny internetowej przy użyciu Azure Portal, interfejsu wiersza polecenia platformy Azure lub programu PowerShell.

Włączanie hostingu statycznej witryny internetowej

Hostowanie statycznej witryny internetowej to funkcja, którą należy włączyć na koncie magazynu.

Portal

1. Zaloguj się do Azure Portal, aby rozpocząć pracę.

2. Znajdź konto magazynu i wybierz je, aby wyświetlić okienko Przegląd konta.

3. W okienku Przegląd wybierz kartę Możliwości . Następnie wybierz pozycję Statyczna witryna internetowa , aby wyświetlić stronę konfiguracji statycznej witryny internetowej.

   

4. Wybierz pozycję Włączone, aby umożliwić hostowanie statycznej witryny internetowej na koncie magazynu.

5. W polu Nazwa dokumentu indeksu określ domyślną stronę indeksu (na przykład :index.html).

   Gdy użytkownik przejdzie do głównego elementu statycznej witryny internetowej, wyświetlona zostanie domyślna strona indeksu.

6. W polu Ścieżka dokumentu Błąd określ domyślną stronę błędu (na przykład :404.html).

   Gdy użytkownik spróbuje przejść do strony, która nie istnieje w statycznej witrynie internetowej, wyświetlona zostanie domyślna strona błędu.

7. Kliknij przycisk Zapisz , aby zakończyć konfigurację lokacji statycznej.

   

8. Zostanie wyświetlony komunikat z potwierdzeniem. Statyczne punkty końcowe witryny internetowej i inne informacje o konfiguracji są wyświetlane w okienku Przegląd .

   

Interfejs wiersza polecenia platformy Azure

Hostowanie statycznej witryny internetowej można włączyć przy użyciu interfejsu wiersza polecenia platformy Azure.

1. Najpierw otwórz Cloud Shell platformy Azure lub jeśli interfejs wiersza polecenia platformy Azure został zainstalowany lokalnie, otwórz aplikację konsolową poleceń, taką jak Windows PowerShell.

2. Jeśli tożsamość jest skojarzona z więcej niż jedną subskrypcją, ustaw aktywną subskrypcję na subskrypcję konta magazynu, które będzie hostować statyczną witrynę internetową.

   az account set --subscription <subscription-id>
   

   Zastąp wartość symbolu <subscription-id> zastępczego identyfikatorem subskrypcji.

3. Włącz hosting statycznej witryny internetowej.

   az storage blob service-properties update --account-name <storage-account-name> --static-website --404-document <error-document-name> --index-document <index-document-name>
   

   • Zastąp wartość symbolu zastępczego <storage-account-name> nazwą konta magazynu.

   • <error-document-name> Zastąp symbol zastępczy nazwą dokumentu o błędzie, który będzie wyświetlany użytkownikom, gdy przeglądarka żąda strony w witrynie, która nie istnieje.

   • <index-document-name> Zastąp symbol zastępczy nazwą dokumentu indeksu. Ten dokument jest często "index.html".

Program PowerShell

Hostowanie statycznej witryny internetowej można włączyć za pomocą modułu Azure PowerShell.

1. Otwórz okno polecenia Windows PowerShell.

2. Sprawdź, czy masz moduł az Azure PowerShell w wersji 0.7 lub nowszej.

   Get-InstalledModule -Name Az -AllVersions | select Name,Version
   

   Jeśli konieczna będzie instalacja lub uaktualnienie, zobacz Instalowanie modułu Azure PowerShell.

3. Zaloguj się do subskrypcji platformy Azure za pomocą polecenia Connect-AzAccount i postępuj zgodnie z instrukcjami wyświetlanymi na ekranie.

   Connect-AzAccount
   

4. Jeśli tożsamość jest skojarzona z więcej niż jedną subskrypcją, ustaw aktywną subskrypcję na subskrypcję konta magazynu, które będzie hostować statyczną witrynę internetową.

   $context = Get-AzSubscription -SubscriptionId <subscription-id>
   Set-AzContext $context
   

   Zastąp wartość symbolu <subscription-id> zastępczego identyfikatorem subskrypcji.

5. Pobierz kontekst konta magazynu, który definiuje konto magazynu, którego chcesz użyć.

   $storageAccount = Get-AzStorageAccount -ResourceGroupName "<resource-group-name>" -AccountName "<storage-account-name>"
   $ctx = $storageAccount.Context
   

   • Zastąp wartość symbolu <resource-group-name> zastępczego nazwą grupy zasobów.

   • Zastąp wartość symbolu zastępczego <storage-account-name> nazwą konta magazynu.

6. Włącz hosting statycznej witryny internetowej.

   Enable-AzStorageStaticWebsite -Context $ctx -IndexDocument <index-document-name> -ErrorDocument404Path <error-document-name>
   

   • <error-document-name> Zastąp symbol zastępczy nazwą dokumentu o błędzie, który będzie wyświetlany użytkownikom, gdy przeglądarka żąda strony w witrynie, która nie istnieje.

   • <index-document-name> Zastąp symbol zastępczy nazwą dokumentu indeksu. Ten dokument jest często "index.html".

Przekazywanie plików

Portal

Poniższe instrukcje pokazują, jak przekazywać pliki przy użyciu Azure Portal. Możesz również użyć narzędzia AzCopy, programu PowerShell, interfejsu wiersza polecenia lub dowolnej niestandardowej aplikacji, która może przekazywać pliki do kontenera $web konta. Aby zapoznać się z samouczkiem krok po kroku, który przekazuje pliki przy użyciu programu Visual Studio Code, zobacz Samouczek: hostowanie statycznej witryny internetowej w usłudze Blob Storage.

1. W Azure Portal przejdź do konta magazynu zawierającego statyczną witrynę internetową. Wybierz pozycję Kontenery w okienku nawigacji po lewej stronie, aby wyświetlić listę kontenerów.

2. W okienku Kontenery wybierz kontener $web , aby otworzyć okienko Przegląd kontenera.

   

3. W okienku Przegląd wybierz ikonę Przekaż , aby otworzyć okienko Przekaż obiekt blob . Następnie wybierz pole Pliki w okienku Przekazywanie obiektu blob , aby otworzyć przeglądarkę plików. Przejdź do pliku, który chcesz przekazać, wybierz go, a następnie wybierz pozycję Otwórz , aby wypełnić pole Pliki . Opcjonalnie zaznacz pole wyboru Zastąp, jeśli pliki już istnieją .

   

4. Jeśli zamierzasz wyświetlić zawartość pliku w przeglądarce, upewnij się, że typ zawartości tego pliku ma wartość text/html. Aby to sprawdzić, wybierz nazwę obiektu blob przekazanego w poprzednim kroku, aby otworzyć okienko Przegląd . Upewnij się, że wartość jest ustawiona w polu właściwości CONTENT-TYPE .

   

   Uwaga

   Ta właściwość jest automatycznie ustawiana dla text/html powszechnie rozpoznawanych rozszerzeń, takich jak .html. Jednak w niektórych przypadkach musisz ustawić to samodzielnie. Jeśli ta właściwość nie zostanie ustawiona na text/html, w przeglądarce zostanie wyświetlony monit o pobranie pliku zamiast renderowania zawartości. Tę właściwość można ustawić w poprzednim kroku.

Interfejs wiersza polecenia platformy Azure

Przekaż obiekty do kontenera $web z katalogu źródłowego.

W tym przykładzie założono, że uruchamiasz polecenia z sesji usługi Azure Cloud Shell.

az storage blob upload-batch -s <source-path> -d '$web' --account-name <storage-account-name>

Uwaga

Jeśli przeglądarka monituje użytkowników o pobranie pliku zamiast renderowania zawartości, możesz dołączyć --content-type 'text/html; charset=utf-8' go do polecenia .

• Zastąp wartość symbolu zastępczego <storage-account-name> nazwą konta magazynu.

• <source-path> Zastąp symbol zastępczy ścieżką do lokalizacji plików, które chcesz przekazać.

Uwaga

Jeśli używasz instalacji lokalizacji interfejsu wiersza polecenia platformy Azure, możesz użyć ścieżki do dowolnej lokalizacji na komputerze lokalnym (na przykład: C:\myFolder.

Jeśli używasz usługi Azure Cloud Shell, musisz odwołać się do udziału plików widocznego dla Cloud Shell. Ta lokalizacja może być udziałem plików samego udziału w chmurze lub istniejącym udziałem plików, który instalujesz z Cloud Shell. Aby dowiedzieć się, jak to zrobić, zobacz Utrwalanie plików na platformie Azure Cloud Shell.

Program PowerShell

Przekaż obiekty do kontenera $web z katalogu źródłowego.

# upload a file
set-AzStorageblobcontent -File "<path-to-file>" `
-Container `$web `
-Blob "<blob-name>" `
-Context $ctx

Uwaga

Jeśli przeglądarka monituje użytkowników o pobranie pliku zamiast renderowania zawartości, możesz dołączyć -Properties @{ ContentType = "text/html; charset=utf-8";} go do polecenia .

• <path-to-file> Zastąp wartość symbolu zastępczego w pełni kwalifikowaną ścieżką do pliku, który chcesz przekazać (na przykład: C:\temp\index.html).

• Zastąp wartość symbolu <blob-name> zastępczego nazwą, którą chcesz nadać wynikowy obiekt blob (na przykład: index.html).

Znajdowanie adresu URL witryny internetowej

Strony witryny można wyświetlić w przeglądarce przy użyciu publicznego adresu URL witryny internetowej.

Portal

W okienku widocznym obok strony przeglądu konta magazynu wybierz pozycję Statyczna witryna internetowa. Adres URL witryny zostanie wyświetlony w polu Podstawowy punkt końcowy .

Interfejs wiersza polecenia platformy Azure

Znajdź publiczny adres URL statycznej witryny internetowej, używając następującego polecenia:

az storage account show -n <storage-account-name> -g <resource-group-name> --query "primaryEndpoints.web" --output tsv

• Zastąp wartość symbolu zastępczego <storage-account-name> nazwą konta magazynu.

• Zastąp wartość symbolu <resource-group-name> zastępczego nazwą grupy zasobów.

Program PowerShell

Znajdź publiczny adres URL statycznej witryny internetowej przy użyciu następującego polecenia:

 $storageAccount = Get-AzStorageAccount -ResourceGroupName "<resource-group-name>" -Name "<storage-account-name>"
Write-Output $storageAccount.PrimaryEndpoints.Web

• Zastąp wartość symbolu <resource-group-name> zastępczego nazwą grupy zasobów.

• Zastąp wartość symbolu zastępczego <storage-account-name> nazwą konta magazynu.

Włączanie metryk na statycznych stronach witryny internetowej

Po włączeniu metryk statystyki ruchu dotyczące plików w kontenerze $web są raportowane na pulpicie nawigacyjnym metryk.

1. Kliknij pozycję Metryki w sekcji Monitorowanie w menu konta magazynu.

   

   Uwaga

   Dane metryk są generowane przez podłączanie do różnych interfejsów API metryk. W portalu są wyświetlane tylko elementy członkowskie interfejsu API używane w danym przedziale czasu, aby skupić się tylko na członkach, którzy zwracają dane. Aby upewnić się, że możesz wybrać niezbędny element członkowski interfejsu API, pierwszym krokiem jest rozwinięcie przedziału czasu.

2. Kliknij przycisk przedziału czasu, wybierz przedział czasu, a następnie kliknij przycisk Zastosuj.

   

3. Wybierz pozycję Obiekt blob z listy rozwijanej Przestrzeń nazw .

   

4. Następnie wybierz metryki Ruch wychodzący .

   

5. Wybierz pozycję Sum (Suma ) z selektora agregacji .

   

6. Kliknij przycisk Dodaj filtr i wybierz pozycję Nazwa interfejsu API z selektora właściwości .

   

7. Zaznacz pole wyboru obok pozycji GetWebContent w selektorze Wartości , aby wypełnić raport metryk.

   

   Uwaga

   Pole wyboru GetWebContent jest wyświetlane tylko wtedy, gdy ten element członkowski interfejsu API został użyty w danym przedziale czasu. W portalu są wyświetlane tylko elementy członkowskie interfejsu API używane w danym przedziale czasu, aby skupić się tylko na członkach, którzy zwracają dane. Jeśli nie możesz znaleźć określonego elementu członkowskiego interfejsu API na tej liście, rozwiń przedział czasu.

Następne kroki

• Dowiedz się, jak skonfigurować domenę niestandardową za pomocą statycznej witryny internetowej. Zobacz Mapuj domenę niestandardową na punkt końcowy Azure Blob Storage.