Tutorial: Erstellen einer serverlosen Benachrichtigungs-App mit Azure Functions und dem Azure Web PubSub-Dienst

Artikel
01/12/2024

Der Azure Web PubSub-Dienst ermöglicht die Erstellung von Webanwendungen für Echtzeit-Messaging mithilfe von WebSockets. Azure Functions ist eine serverlose Plattform, mit der Sie Ihren Code ohne Verwaltung von Infrastruktur ausführen können. In diesem Tutorial erfahren Sie, wie Sie den Azure Web PubSub-Dienst und Azure Functions verwenden, um eine serverlose Anwendung mit Echtzeit-Messaging für Benachrichtigungszenarien zu erstellen.

In diesem Tutorial lernen Sie Folgendes:

Erstellen einer serverlosen Benachrichtigungs-App
Verwenden von Eingabe- und Ausgabebindungen für Web PubSub-Funktionen
Lokales Ausführen der Beispielfunktionen
Bereitstellen der Funktion in der Azure-Funktions-App

Voraussetzungen

Ein Code-Editor wie Visual Studio Code
Node.js, Version 18.x oder höher.

Hinweis

Weitere Informationen zu den unterstützten Versionen von Node.js finden Sie in der Übersicht über die Runtimeversionen von Azure Functions.
Azure Functions Core Tools (v4 oder höher bevorzugt), um Azure Funktions-Apps lokal auszuführen und in Azure bereitzustellen.
Azure CLI zum Verwalten von Azure-Ressourcen

Wenn Sie kein Azure-Abonnement haben, erstellen Sie ein kostenloses Azure-Konto, bevor Sie beginnen.

Melden Sie sich unter https://portal.azure.com/ mit Ihrem Azure-Konto beim Azure-Portal an.

Erstellen einer Azure Web PubSub-Dienstinstanz

Ihre Anwendung stellt eine Verbindung mit einer Instanz des Web PubSub-Diensts in Azure her.

Klicken Sie in der linken oberen Ecke des Azure-Portals auf die Schaltfläche „Neu“. Geben Sie im Bildschirm „Neu“ den Begriff Web PubSub in das Suchfeld ein, und drücken Sie die EINGABETASTE. (Sie können Azure Web PubSub auch in der Kategorie Web durchsuchen.)
Wählen Sie in den Suchergebnissen Web PubSub und dann Erstellen aus.

Geben Sie folgende Einstellungen ein.

Einstellung	Vorgeschlagener Wert	BESCHREIBUNG
Ressourcenname	Global eindeutiger Name	Der global eindeutige Name, welcher Ihre neue Web PubSub-Dienstinstanz identifiziert. Gültige Zeichen sind `a-z`, `A-Z`, `0-9` und `-`.
Abonnement	Ihr Abonnement	Das Azure-Web PubSubAbonnement, unter dem diese neue Web PubSub-Dienstinstanz erstellt wird.
Ressourcengruppe	myResourceGroup	Name für die neue Ressourcengruppe, in der Ihre Web PubSub-Dienstinstanz erstellt werden soll
Location	USA (Westen)	Wählen Sie eine Region in Ihrer Nähe aus.
Preisstufe	Kostenlos	Sie können Azure Web PubSub zuerst kostenlos ausprobieren. Erfahren Sie mehr über die Tarife des Azure Web PubSub-Diensts.
Einheitenanzahl	-	Die Einheitenanzahl gibt an, wie viele Verbindungen Ihre Instanz des Web PubSub-Dienstes akzeptieren kann. Jede Einheit unterstützt höchstens 1.000 gleichzeitige Verbindungen. Dies kann nur im Tarif „Standard“ konfiguriert werden.

Screenshot of creating the Azure Web PubSub instance in portal.

Wählen Sie Erstellen aus, um mit der Bereitstellung der Instanz des Web PubSub-Dienstes zu beginnen.

Erstellen und lokales Ausführen der Funktionen

Stellen Sie sicher, dass Azure Functions Core Tools installiert ist. Erstellen Sie nun ein leeres Verzeichnis für das Projekt. Führen Sie den Befehl unter diesem Arbeitsverzeichnis aus. Verwenden Sie eine der folgenden Optionen.
```
func init --worker-runtime javascript --model V4
```
```
func init --worker-runtime javascript --model V3
```
```
func init --worker-runtime dotnet
```
```
func init --worker-runtime dotnet-isolated
```
```
func init --worker-runtime python --model V1
```
Führen Sie die Schritte zum Installieren Microsoft.Azure.WebJobs.Extensions.WebPubSubaus.
Bestätigen oder aktualisieren host.jsonSie 's extensionBundle auf Version 4.* oder höher, um Web PubSub-Support zu erhalten. Um die host.jsonDatei zu aktualisieren, öffnen Sie die Datei im Editor, und ersetzen Sie dann die vorhandene Version extensionBundle auf Version 4.* oder höher.
```
{
    "extensionBundle": {
        "id": "Microsoft.Azure.Functions.ExtensionBundle",
        "version": "[4.*, 5.0.0)"
    }
}
```
Bestätigen oder aktualisieren host.jsonSie 's extensionBundle auf Version 3.3.0 oder höher, um Web PubSub-Support zu erhalten. Um die host.jsonDatei zu aktualisieren, öffnen Sie die Datei im Editor, und ersetzen Sie dann die vorhandene VersionserweiterungBundle in Version 3.3.0 oder höher.
```
{
    "extensionBundle": {
        "id": "Microsoft.Azure.Functions.ExtensionBundle",
        "version": "[3.3.*, 4.0.0)"
    }
}
```
```
dotnet add package Microsoft.Azure.WebJobs.Extensions.WebPubSub
```
```
dotnet add package Microsoft.Azure.Functions.Worker.Extensions.WebPubSub --prerelease
```
Aktualisieren Sie „extensionBundle“ (host.json) auf Version 3.3.0 oder höher, um Web PubSub-Unterstützung zu erhalten. Um die host.jsonDatei zu aktualisieren, öffnen Sie die Datei im Editor, und ersetzen Sie dann die vorhandene VersionserweiterungBundle in Version 3.3.0 oder höher.
```
{
    "extensionBundle": {
        "id": "Microsoft.Azure.Functions.ExtensionBundle",
        "version": "[3.3.*, 4.0.0)"
    }
}
```

Erstellen Sie eine index-Funktion zum Lesen und Hosten einer statischen Webseite für Clients.

func new -n index -t HttpTrigger

Aktualisieren Sie src/functions/index.js und kopieren Sie den folgenden Code.

const { app } = require('@azure/functions');
const { readFile } = require('fs/promises');

app.http('index', {
    methods: ['GET', 'POST'],
    authLevel: 'anonymous',
    handler: async (context) => {
        const content = await readFile('index.html', 'utf8', (err, data) => {
            if (err) {
                context.err(err)
                return
            }
        });

        return { 
            status: 200,
            headers: { 
                'Content-Type': 'text/html'
            }, 
            body: content, 
        };
    }
});

Aktualisieren Sie index/function.json und kopieren Sie den folgenden JSON-Code.

{
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": [
        "get",
        "post"
      ]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "res"
    }
  ]
}

Aktualisieren Sie index/index.js und kopieren Sie den folgenden Code.

var fs = require('fs');
var path = require('path');

module.exports = function (context, req) {
    var index = context.executionContext.functionDirectory + '/../index.html';
    context.log("index.html path: " + index);
    fs.readFile(index, 'utf8', function (err, data) {
        if (err) {
            console.log(err);
            context.done(err);
        }
        context.res = {
            status: 200,
            headers: {
                'Content-Type': 'text/html'
            },
            body: data
        };
        context.done();
    });
}

Aktualisieren Sie index.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[FunctionName("index")]
public static IActionResult Run([HttpTrigger(AuthorizationLevel.Anonymous)] HttpRequest req, ExecutionContext context, ILogger log)
{
    var indexFile = Path.Combine(context.FunctionAppDirectory, "index.html");
    log.LogInformation($"index.html path: {indexFile}.");
    return new ContentResult
    {
        Content = File.ReadAllText(indexFile),
        ContentType = "text/html",
    };
}

Aktualisieren Sie index.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[Function("index")]
public HttpResponseData Run([HttpTrigger(AuthorizationLevel.Anonymous, "get", "post")] HttpRequestData req, FunctionContext context)
{
    var path = Path.Combine(context.FunctionDefinition.PathToAssembly, "../index.html");
    _logger.LogInformation($"index.html path: {path}.");

    var response = req.CreateResponse();
    response.WriteString(File.ReadAllText(path));
    response.Headers.Add("Content-Type", "text/html");
    return response;
}

Aktualisieren Sie index/function.json und kopieren Sie den folgenden JSON-Code.

{
  "scriptFile": "__init__.py",
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": [
        "get",
        "post"
      ]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "$return"
    }
  ]
}

Aktualisieren Sie index/__init__.py und kopieren Sie den folgenden Code.

import os

import azure.functions as func

def main(req: func.HttpRequest) -> func.HttpResponse:
    f = open(os.path.dirname(os.path.realpath(__file__)) + '/../index.html')
    return func.HttpResponse(f.read(), mimetype='text/html')

Erstellen Sie eine negotiate-Funktion, damit Clients die Dienstverbindungs-URL mit Zugriffstoken abrufen können.

func new -n negotiate -t HttpTrigger

Aktualisieren Sie src/functions/negotiate.js und kopieren Sie den folgenden Code.

const { app, input } = require('@azure/functions');

const connection = input.generic({
    type: 'webPubSubConnection',
    name: 'connection',
    hub: 'notification'
});

app.http('negotiate', {
    methods: ['GET', 'POST'],
    authLevel: 'anonymous',
    extraInputs: [connection],
    handler: async (request, context) => {
        return { body: JSON.stringify(context.extraInputs.get('connection')) };
    },
});

Aktualisieren Sie negotiate/function.json und kopieren Sie den folgenden JSON-Code.

{
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req"
    },
    {
      "type": "http",
      "direction": "out",
      "name": "res"
    },
    {
      "type": "webPubSubConnection",
      "name": "connection",
      "hub": "notification",
      "direction": "in"
    }
  ]
}

Erstellen Sie einen Ordner, um den Code auszuhandeln und zu aktualisieren negotiate/index.js und zu kopieren.

module.exports = function (context, req, connection) {
    context.res = { body: connection };
    context.done();
};

Aktualisieren Sie negotiate.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[FunctionName("negotiate")]
public static WebPubSubConnection Run(
    [HttpTrigger(AuthorizationLevel.Anonymous, "get", "post", Route = null)] HttpRequest req,
    [WebPubSubConnection(Hub = "notification")] WebPubSubConnection connection,
    ILogger log)
{
    log.LogInformation("Connecting...");

    return connection;
}

Fügen Sie im Header die Anweisungen using hinzu, um erforderliche Abhängigkeiten aufzulösen.
```
using Microsoft.Azure.WebJobs.Extensions.WebPubSub;
```

Aktualisieren Sie negotiate.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[Function("negotiate")]
public HttpResponseData Run([HttpTrigger(AuthorizationLevel.Anonymous, "get", "post")] HttpRequestData req,
    [WebPubSubConnectionInput(Hub = "notification")] WebPubSubConnection connectionInfo)
{
    var response = req.CreateResponse(HttpStatusCode.OK);
    response.WriteAsJsonAsync(connectionInfo);
    return response;
}

Erstellen Sie einen Ordner, der aushandeln und aktualisieren negotiate/function.json und kopieren Sie die folgenden JSON-Codes.

{
  "scriptFile": "__init__.py",
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req"
    },
    {
      "type": "http",
      "direction": "out",
      "name": "$return"
    },
    {
      "type": "webPubSubConnection",
      "name": "connection",
      "hub": "notification",
      "direction": "in"
    }
  ]
}

Aktualisieren Sie negotiate/__init__.py und kopieren Sie den folgenden Code.

import logging

import azure.functions as func


def main(req: func.HttpRequest, connection) -> func.HttpResponse:
    return func.HttpResponse(connection)

Erstellen Sie eine notification-Funktion zum Generieren von Benachrichtigungen mit TimerTrigger.

func new -n notification -t TimerTrigger

Aktualisieren Sie src/functions/notification.js und kopieren Sie den folgenden Code.

const { app, output } = require('@azure/functions');

const wpsAction = output.generic({
    type: 'webPubSub',
    name: 'action',
    hub: 'notification'
});

app.timer('notification', {
    schedule: "*/10 * * * * *",
    extraOutputs: [wpsAction],
    handler: (myTimer, context) => {
        context.extraOutputs.set(wpsAction, {
            actionName: 'sendToAll',
            data: `[DateTime: ${new Date()}] Temperature: ${getValue(22, 1)}\xB0C, Humidity: ${getValue(40, 2)}%`,
            dataType: 'text',
        });
    },
});

function getValue(baseNum, floatNum) {
    return (baseNum + 2 * floatNum * (Math.random() - 0.5)).toFixed(3);
}

Aktualisieren Sie notification/function.json und kopieren Sie den folgenden JSON-Code.

{
  "bindings": [
    {
      "name": "myTimer",
      "type": "timerTrigger",
      "direction": "in",
      "schedule": "*/10 * * * * *"
    },
    {
      "type": "webPubSub",
      "name": "actions",
      "hub": "notification",
      "direction": "out"
    }
  ]
}

Aktualisieren Sie notification/index.js und kopieren Sie den folgenden Code.

module.exports = function (context, myTimer) {
    context.bindings.actions = {
        "actionName": "sendToAll",
        "data": `[DateTime: ${new Date()}] Temperature: ${getValue(22, 1)}\xB0C, Humidity: ${getValue(40, 2)}%`,
        "dataType": "text"
    }
    context.done();
};

function getValue(baseNum, floatNum) {
    return (baseNum + 2 * floatNum * (Math.random() - 0.5)).toFixed(3);
}

Aktualisieren Sie notification.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[FunctionName("notification")]
public static async Task Run([TimerTrigger("*/10 * * * * *")]TimerInfo myTimer, ILogger log,
    [WebPubSub(Hub = "notification")] IAsyncCollector<WebPubSubAction> actions)
{
    await actions.AddAsync(new SendToAllAction
    {
        Data = BinaryData.FromString($"[DateTime: {DateTime.Now}] Temperature: {GetValue(23, 1)}{'\xB0'}C, Humidity: {GetValue(40, 2)}%"),
        DataType = WebPubSubDataType.Text
    });
}

private static string GetValue(double baseNum, double floatNum)
{
    var rng = new Random();
    var value = baseNum + floatNum * 2 * (rng.NextDouble() - 0.5);
    return value.ToString("0.000");
}

Fügen Sie im Header die Anweisungen using hinzu, um erforderliche Abhängigkeiten aufzulösen.

using System.Threading.Tasks;
using Microsoft.Azure.WebJobs.Extensions.WebPubSub;
using Microsoft.Azure.WebPubSub.Common;

Aktualisieren Sie notification.cs und ersetzen Sie die Run-Funktion durch den folgenden Code.

[Function("notification")]
[WebPubSubOutput(Hub = "notification")]
public SendToAllAction Run([TimerTrigger("*/10 * * * * *")] MyInfo myTimer)
{
    return new SendToAllAction
    {
        Data = BinaryData.FromString($"[DateTime: {DateTime.Now}] Temperature: {GetValue(23, 1)}{'\xB0'}C, Humidity: {GetValue(40, 2)}%"),
        DataType = WebPubSubDataType.Text
    };
}

private static string GetValue(double baseNum, double floatNum)
{
    var rng = new Random();
    var value = baseNum + floatNum * 2 * (rng.NextDouble() - 0.5);
    return value.ToString("0.000");
}

Erstellen Sie eine Ordnerbenachrichtigung, aktualisieren notification/function.json Und kopieren Sie die folgenden JSON-Codes.

{
  "scriptFile": "__init__.py",
  "bindings": [
    {
      "name": "myTimer",
      "type": "timerTrigger",
      "direction": "in",
      "schedule": "*/10 * * * * *"
    },
    {
      "type": "webPubSub",
      "name": "actions",
      "hub": "notification",
      "direction": "out"
    }
  ]
}

Aktualisieren Sie notification/__init__.py und kopieren Sie den folgenden Code.

import datetime
import random
import json

import azure.functions as func

def main(myTimer: func.TimerRequest, actions: func.Out[str]) -> None:
    time = datetime.datetime.now().strftime("%A %d-%b-%Y %H:%M:%S")
    actions.set(json.dumps({
        'actionName': 'sendToAll',
        'data': '\x5B DateTime: {0} \x5D Temperature: {1:.3f} \xB0C, Humidity: {2:.3f} \x25'.format(time, 22 + 2 * (random.random() - 0.5), 44 + 4 * (random.random() - 0.5)),
        'dataType': 'text'
    }))

Fügen Sie im Stammordner des Projekts die Client-Einzelseite index.html hinzu und kopieren Sie den Inhalt.

<html>
    <body>
    <h1>Azure Web PubSub Notification</h1>
    <div id="messages"></div>
    <script>
        (async function () {
            let messages = document.querySelector('#messages');
            let res = await fetch(`${window.location.origin}/api/negotiate`);
            let url = await res.json();
            let ws = new WebSocket(url.url);
            ws.onopen = () => console.log('connected');

            ws.onmessage = event => {
                let m = document.createElement('p');
                m.innerText = event.data;
                messages.appendChild(m);
            };
        })();
    </script>
    </body>
</html>

Da das C#-Projekt Dateien in einen anderen Ausgabeordner kompiliert, müssen Sie Ihre *.csproj aktualisieren, damit die Inhaltsseite enthalten ist.

<ItemGroup>
    <None Update="index.html">
        <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
</ItemGroup>

Da das C#-Projekt Dateien in einen anderen Ausgabeordner kompiliert, müssen Sie Ihre *.csproj aktualisieren, damit die Inhaltsseite enthalten ist.

<ItemGroup>
    <None Update="index.html">
        <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
</ItemGroup>

Konfigurieren und Ausführen der Azure Functions-App
- Öffnen Sie im Browser das Azure-Portal, und vergewissern Sie sich, dass die zuvor bereitgestellte Instanz des Web PubSub-Diensts erfolgreich erstellt wurde. Navigieren Sie zu der Instanz.
- Wählen Sie Schlüssel aus, und kopieren Sie die Verbindungszeichenfolge.
Führen Sie den Befehl im Funktionsordner aus, um die Verbindungszeichenfolge des Dienstes festzulegen. Ersetzen Sie <connection-string> durch den jeweils erforderlichen Wert.
```
func settings add WebPubSubConnectionString "<connection-string>"
```
Hinweis

Das im Beispiel verwendete TimerTrigger ist von Azure Storage abhängig. Sie können jedoch den lokalen Speicheremulator verwenden, wenn die Funktion lokal ausgeführt wird. Wird eine Fehlermeldung wie There was an error performing a read operation on the Blob Storage Secret Repository. Please ensure the 'AzureWebJobsStorage' connection string is valid. angezeigt, müssen Sie den There was an error performing a read operation on the Blob Storage Secret Repository. Please ensure the 'AzureWebJobsStorage' connection string is valid. herunterladen und aktivieren.

Jetzt können Sie Ihre lokale Funktion per Befehl ausführen.
```
func start --port 7071
```
Wenn Sie die ausgeführten Protokolle überprüfen, können Sie die statische Seite Ihres lokalen Hosts über http://localhost:7071/api/index aufrufen.

Hinweis

Einige Browser leiten automatisch auf https um, was zu einer falschen URL führt. Empfehlen Sie die Verwendung von Edge und überprüfen Sie die URL, wenn das Rendering nicht erfolgreich ist.

Bereitstellen der Funktions-App in Azure

Zum Bereitstellen Ihres Funktionscodes in Azure müssen Sie drei Ressourcen erstellen:

Eine Ressourcengruppe als logischen Container für verwandte Ressourcen.
Ein Speicherkonto, das verwendet wird, um den Status und andere Informationen zu Ihren Funktionen zu verwalten.
Eine Funktions-App, die als Umgebung zum Ausführen Ihres Funktionscodes dient. Eine Funktions-App ist Ihrem lokalen Funktionsprojekt zugeordnet und ermöglicht Ihnen das Gruppieren von Funktionen als logische Einheit, um die Verwaltung, Bereitstellung und Freigabe von Ressourcen zu vereinfachen.

Verwenden Sie die folgenden Befehle, um diese Elemente zu erstellen.

Melden Sie sich bei Azure an:
```
az login
```
Erstellen Sie eine Ressourcengruppe oder verwenden Sie einfach die Ressourcengruppe des Azure Web PubSub-Dienstes weiter:
```
az group create -n WebPubSubFunction -l <REGION>
```
Erstellen Sie in Ihrer Ressourcengruppe und Region ein universelles Speicherkonto:
```
az storage account create -n <STORAGE_NAME> -l <REGION> -g WebPubSubFunction
```

Erstellen Sie die Funktions-App in Azure:

az functionapp create --resource-group WebPubSubFunction --consumption-plan-location <REGION> --runtime node --runtime-version 18 --functions-version 4 --name <FUNCIONAPP_NAME> --storage-account <STORAGE_NAME>

Hinweis

Lesen Sie die Dokumentation zu den Azure Functions Runtime-Versionen, um den Parameter --runtime-version auf einen unterstützten Wert zu setzen.

az functionapp create --resource-group WebPubSubFunction --consumption-plan-location <REGION> --runtime node --runtime-version 18 --functions-version 4 --name <FUNCIONAPP_NAME> --storage-account <STORAGE_NAME>

Hinweis

Lesen Sie die Dokumentation zu den Azure Functions Runtime-Versionen, um den Parameter --runtime-version auf einen unterstützten Wert zu setzen.

az functionapp create --resource-group WebPubSubFunction --consumption-plan-location <REGION> --runtime dotnet --functions-version 4 --name <FUNCIONAPP_NAME> --storage-account <STORAGE_NAME>

az functionapp create --resource-group WebPubSubFunction --consumption-plan-location <REGION> --runtime dotnet-isolated --functions-version 4 --name <FUNCIONAPP_NAME> --storage-account <STORAGE_NAME>

az functionapp create --resource-group WebPubSubFunction --consumption-plan-location <REGION> --runtime python --runtime-version 3.9 --functions-version 4 --name <FUNCIONAPP_NAME> --os-type linux --storage-account <STORAGE_NAME>

Stellen Sie das Funktionsprojekts in Azure bereit:

Nachdem Sie Ihre Funktions-App in Azure erstellt haben, können Sie jetzt Ihr lokales Funktionsprojekt mithilfe des Veröffentlichungsbefehls "azure functionapp veröffentlichen " bereitstellen.
```
func azure functionapp publish <FUNCIONAPP_NAME> --publish-local-settings
```
Hinweis

Hier werden die lokalen Einstellungen von local.settings.json zusammen mit dem Befehlsparameter --publish-local-settings bereitgestellt. Wenn Sie den Microsoft Azure-Speicheremulator verwenden, können Sie no für die folgende Eingabeaufforderung eingeben, damit dieser Wert in Azure nicht überschrieben wird: App setting AzureWebJobsStorage is different between azure and local.settings.json, Would you like to overwrite value in azure? [yes/no/show]. Darüber hinaus können Sie die Einstellungen für die Funktions-App im Azure-Portal unter Einstellungen>Konfiguration aktualisieren.
Nun können Sie Ihre Website über die Azure-Funktions-App überprüfen, indem Sie zur URL https://<FUNCIONAPP_NAME>.azurewebsites.net/api/index navigieren.

Bereinigen von Ressourcen

Wenn Sie diese App nicht mehr benötigen, löschen Sie alle im Rahmen dieser Dokumentation erstellten Ressourcen, damit keine Gebühren anfallen. Gehen Sie dazu wie folgt vor:

Klicken Sie ganz links im Azure-Portal auf Ressourcengruppen und anschließend auf die erstellte Ressourcengruppe. Verwenden Sie stattdessen das Suchfeld, um die Ressourcengruppe anhand ihres Namens zu finden.
Wählen im daraufhin angezeigten Fenster die Ressourcengruppe und anschließend die Option Ressourcengruppe löschen aus.
Geben Sie im neuen Fenster den Namen der Ressourcengruppe ein, die Sie löschen möchten, und wählen Sie Löschen aus.

Nächste Schritte

In dieser Schnellstartanleitung haben Sie gelernt, wie Sie eine serverlose Benachrichtigungsanwendung ausführen. Sie können nun damit beginnen, Ihre eigene Anwendung zu erstellen.

Tutorial: Erstellen eines einfachen Chatrooms mit Azure Web PubSub

Azure Web PubSub-Bindungen für Azure Functions

Weitere Beispiele für Azure Web PubSub