Udostępnij za pomocą


Szybki start: tworzenie aplikacji do czatu przy użyciu funkcji platformy Azure w trybie bezserwerowym Socket.IO (wersja zapoznawcza)

W tym artykule dowiesz się, jak utworzyć aplikację do czatu przy użyciu usługi Web PubSub dla Socket.IO w trybie bezserwerowym za pomocą usługi Azure Functions. Samouczek przeprowadzi Cię przez proces zabezpieczania aplikacji przy użyciu uwierzytelniania opartego na tożsamościach podczas pracy w trybie online.

Źródło projektu używa narzędzia Bicep do wdrożenia infrastruktury na platformie Azure oraz narzędzi Azure Functions Core Tools w celu wdrożenia kodu w aplikacji funkcji.

Wymagania wstępne

Pobieranie przykładowego kodu

Znajdź przykładowy kod: Socket.IO przykład bezserwerowy (TS)

git clone https://github.com/Azure/azure-webpubsub.git
cd ./sdk/webpubsub-socketio-extension/examples/chat-serverless-typescript

Wdrażanie infrastruktury

Przykłady czatów muszą wdrożyć kilka usług na platformie Azure:

Używamy Bicep do wdrożenia infrastruktury. Plik znajduje się w folderze ./infra . Wdróż go za pomocą polecenia az:

az deployment sub create -n "<deployment-name>" -l "<deployment-location>" --template-file ./infra/main.bicep --parameters environmentName="<env-name>" location="<location>"
  • <deployment-name>: nazwa wdrożenia.
  • <deployment-location>: lokalizacja metadanych wdrożenia. Należy pamiętać, że nie jest to lokalizacja, w której wdrażane są zasoby.
  • <env-name>: Nazwa jest częścią nazwy grupy zasobów i nazwy zasobu.
  • <location>: lokalizacja zasobów.

Przegląd infrastruktury

W wydaniu infrastruktury wdrożymy aplikację funkcji platformy Azure w planie zużycia oraz konto monitora i magazynu wymagane przez aplikację funkcji. Wdrażamy również web pubSub dla zasobu Socket.IO w trybie bezserwerowym.

W celu uwierzytelniania opartego na tożsamości wdrożymy tożsamość zarządzaną przypisaną przez użytkownika, przypiszemy ją do aplikacji funkcji i Socket.IO zasobu i przyznamy mu pewne uprawnienia:

  • Rola właściciela danych obiektu blob usługi Storage: uzyskiwanie dostępu do magazynu dla aplikacji funkcji
  • Rola wydawcy metryk monitorowania: monitor dostępu dla aplikacji funkcji
  • Rola właściciela usługi Web PubSub: Uzyskiwanie dostępu do usługi Web PubSub dla Socket.IO dla aplikacji funkcji

Zgodnie z konfiguracją aplikacji usługi Azure Functions w celu korzystania z logowania w usłudze Microsoft Entra tworzymy jednostkę usługi. Aby uniknąć używania wpisu tajnego dla jednostki usługi, używamy poświadczeń tożsamości federacyjnej.

Wdrażanie przykładu w aplikacji funkcji

Przygotowaliśmy skrypt powłoki bash w celu wdrożenia przykładowego kodu w aplikacji funkcji:

# Deploy the project
./deploy/deploy.sh "<deployment-name>"

Przejrzyj szczegóły wdrożenia

Aby wdrożyć przykładową aplikację, należy wykonać dwa kroki.

  • Publikowanie kodu w aplikacji funkcji (korzystanie z narzędzi Azure Functions Core Tools)

    func extensions sync
    npm install
    npm run build
    func azure functionapp publish <function-app-name>
    
  • Skonfiguruj usługę Web PubSub dla Socket.IO, aby dodać ustawienie centrum, które może wysyłać żądanie do aplikacji funkcji. Zgodnie z ograniczeniami dostawcy elementu webhook aplikacji funkcji należy uzyskać klucz rozszerzenia wypełniony przez funkcję. Uzyskaj więcej szczegółów w temacie Powiązanie wyzwalacza. W miarę używania uwierzytelniania opartego na tożsamościach w ustawieniach centrum należy przypisać zasób docelowy, czyli clientId utworzonej wcześniej jednostki usługi.

    code=$(az functionapp keys list -g <resource-group> -n <function-name> --query systemKeys.socketio_extension -o tsv)
    az webpubsub hub create -n <socketio-name> -g <resource-group> --hub-name "hub" --event-handler url-template="https://${<function-name>}.azurewebsites.net/runtime/webhooks/socketio?code=${code}" user-event-pattern="*" auth-type="ManagedIdentity" auth-resource="<service-principal-client-id>"
    

Uruchamianie przykładowej aplikacji

Po wdrożeniu kodu odwiedź witrynę internetową, aby wypróbować przykład:

https://<function-endpoint>/api/index

Zrzut ekranu przedstawiający aplikację do czatu bezserwerowego.

Następne kroki

Następnie możesz wykonać czynności opisane w samouczku, aby napisać aplikację krok po kroku: