Samouczek: hostowanie statycznej witryny internetowej w usłudze Blob Storage

2025-04-04

Z tego samouczka dowiesz się, jak utworzyć i wdrożyć statyczną witrynę internetową w usłudze Azure Storage. Po zakończeniu będziesz mieć statyczną witrynę internetową, do której użytkownicy mogą uzyskiwać dostęp publicznie.

Z tego samouczka dowiesz się, jak wykonywać następujące działania:

Konfigurowanie hostingu statycznej witryny internetowej
Wdrażanie witryny internetowej Hello World

Statyczne witryny internetowe mają pewne ograniczenia. Jeśli na przykład chcesz skonfigurować nagłówki, musisz użyć usługi Azure Content Delivery Network (Azure CDN). Nie ma możliwości konfigurowania nagłówków w ramach samej funkcji statycznej witryny internetowej. Ponadto AuthN i AuthZ nie są obsługiwane.

Jeśli te funkcje są ważne w twoim scenariuszu, rozważ użycie usługi Azure Static Web Apps. Jest to świetna alternatywa dla statycznych witryn internetowych i jest również odpowiednia w przypadkach, gdy nie trzeba renderować zawartości przez serwer internetowy. Można skonfigurować nagłówki, a AuthN / AuthZ jest w pełni obsługiwane. Usługa Azure Static Web Apps udostępnia również kompleksowo zarządzany przepływ pracy ciągłej integracji i ciągłego dostarczania (CI/CD) ze źródła usługi GitHub do wdrożenia na skalę globalną.

W tym filmie wideo pokazano, jak hostować statyczną witrynę internetową w usłudze Blob Storage.

Kroki opisane w filmie wideo zostały również opisane w poniższych sekcjach.

Wymagania wstępne

Aby uzyskać dostęp do usługi Azure Storage, potrzebujesz subskrypcji platformy Azure. Jeśli nie masz jeszcze subskrypcji, przed rozpoczęciem utwórz bezpłatne konto .

Cały dostęp do usługi Azure Storage odbywa się za pośrednictwem konta magazynowania. Na potrzeby tego szybkiego startu utwórz konto magazynu w portalu Azure, programie Azure PowerShell lub interfejsie wiersza polecenia platformy Azure. Aby uzyskać pomoc dotyczącą tworzenia konta magazynowego, zobacz Tworzenie konta magazynowego.

Uwaga

Statyczne witryny internetowe są teraz dostępne dla kont typu V2 ogólnego przeznaczenia poziomu Standard, a także kont magazynu, które mają włączoną hierarchiczną przestrzeń nazw.

W tym samouczku użyto programu Visual Studio Code, bezpłatnego narzędzia dla programistów, aby utworzyć statyczną witrynę internetową i wdrożyć ją na koncie usługi Azure Storage.

Po zainstalowaniu programu Visual Studio Code zainstaluj rozszerzenie usługi Azure Storage w wersji zapoznawczej. To rozszerzenie integruje funkcje zarządzania usługą Azure Storage z programem Visual Studio Code. Użyjesz rozszerzenia , aby wdrożyć statyczną witrynę internetową w usłudze Azure Storage. Aby zainstalować rozszerzenie:

Uruchom program Visual Studio Code.
Na pasku narzędzi kliknij pozycję Rozszerzenia. Wyszukaj usługę Azure Storage i wybierz rozszerzenie usługi Azure Storage z listy. Następnie kliknij przycisk Zainstaluj , aby zainstalować rozszerzenie.

Konfigurowanie hostingu statycznej witryny internetowej

Pierwszym krokiem jest skonfigurowanie konta magazynowego, aby hostować statyczną stronę w portalu Azure. Podczas konfigurowania konta na potrzeby hostowania statycznej witryny internetowej usługa Azure Storage automatycznie tworzy kontener o nazwie $web. Kontener $web będzie zawierać pliki statycznej witryny internetowej.

Zaloguj się do witryny Azure Portal w przeglądarce internetowej.
Znajdź swoje konto magazynowania i wyświetl jego podsumowanie.
Wybierz pozycję Statyczna witryna internetowa , aby wyświetlić stronę konfiguracji statycznych witryn internetowych.
Wybierz Włączone, aby włączyć hostowanie statycznej witryny internetowej dla konta magazynowego.
W polu Nazwa dokumentu indeksu określ domyślną stronę indeksu index.html. Domyślna strona indeksu jest wyświetlana, gdy użytkownik przejdzie do katalogu głównego statycznej witryny internetowej.
W polu Ścieżka dokumentu błędu określ domyślną stronę błędu 404.html. Domyślna strona błędu jest wyświetlana, gdy użytkownik próbuje przejść do strony, która nie istnieje w statycznej witrynie internetowej.
Kliknij przycisk Zapisz. Portal Azure teraz wyświetla punkt końcowy statycznej witryny internetowej.

Wdrażanie witryny internetowej Hello World

Następnie utwórz stronę internetową Hello World za pomocą programu Visual Studio Code i wdróż ją w statycznej witrynie internetowej hostowanej na koncie usługi Azure Storage.

Utwórz pusty folder o nazwie mywebsite w lokalnym systemie plików.
Uruchom program Visual Studio Code i otwórz folder utworzony właśnie na panelu Eksploratora .
Utwórz domyślny plik indeksu w folderze mywebsite i nadaj mu nazwę index.html.

Otwórz index.html w edytorze, wklej następujący tekst do pliku i zapisz go:

<!DOCTYPE html>
<html>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

Utwórz domyślny plik błędu i nadaj mu nazwę 404.html.
Otwórz 404.html w edytorze, wklej następujący tekst do pliku i zapisz go:
```
<!DOCTYPE html>
<html>
  <body>
    <h1>404</h1>
  </body>
</html>
```
Kliknij prawym przyciskiem myszy folder mywebsite w panelu Eksploratora i wybierz polecenie Wdróż w statycznej witrynie internetowej... w celu wdrożenia witryny internetowej. Zostanie wyświetlony monit o zalogowanie się do platformy Azure w celu pobrania listy subskrypcji.
Wybierz subskrypcję zawierającą kontener, dla którego włączono hosting statycznej witryny internetowej. Następnie, gdy zostaniesz poproszony, wybierz konto przechowywania.

Program Visual Studio Code przekaże teraz pliki do internetowego punktu końcowego i wyświetli pasek stanu powodzenia. Uruchom witrynę internetową, aby wyświetlić ją na platformie Azure.

Pomyślnie ukończono samouczek i wdrożono statyczną witrynę internetową na platformie Azure.

Obsługa funkcji

Może to mieć wpływ na obsługę tej funkcji przez włączenie protokołu Data Lake Storage Gen2, sieciowego systemu plików (NFS) 3.0 lub protokołu SSH File Transfer Protocol (SFTP). Jeśli włączono dowolną z tych funkcji, zobacz Obsługa funkcji usługi Blob Storage na kontach usługi Azure Storage, aby ocenić obsługę tej funkcji.

Następne kroki

W tym samouczku przedstawiono sposób konfigurowania konta usługi Azure Storage na potrzeby hostowania statycznej witryny internetowej oraz tworzenia i wdrażania statycznej witryny internetowej w punkcie końcowym platformy Azure.

Następnie dowiedz się, jak skonfigurować domenę niestandardową przy użyciu statycznej witryny internetowej.

Przypisz domenę niestandardową do adresu końcowego usługi Azure Blob Storage