Generieren eines Besprechungstokens für Teilnehmer - Teams

Die Besprechungstoken-App trägt dazu bei, Ihre Besprechungserfahrung in Teams zu verbessern, indem besprechungsteilnehmer Token anfordern und Token generieren können. Die App generiert Token sequenziell, sodass jeder Teilnehmer die gleiche Möglichkeit hat, in der Besprechung zu interagieren. Die App ist z. B. in Q&A-Sitzungen und in Besprechungen wie Scrum-Besprechungen nützlich.

Hinweis

Die Registerkarten in Besprechungen für die App zum Generieren von Besprechungstoken sind nur für den Teams-Desktopclient verfügbar.

Wichtige Features des Besprechungstokengenerators

Zeigt das aktuelle Token an, das in der Besprechung verwendet wird.
Zeigt die Benutzerliste an, die basierend auf der Tokennummer sortiert ist.
Generiert auf Anforderung ein Token für den Benutzer.
Zeigt die Tokennummer des aktuellen Benutzers an.
Ermöglicht dem Organisator, das aktuelle Besprechungstoken zu überspringen.

Verschiedene Arten von Benutzerinteraktionen

Token: Fordert token für den Benutzer an.
Fertig: Bestätigt die Tokengenerierung für den Benutzer.
Überspringen: Überspringt den aktuellen Benutzer und wechselt zur nächsten Person in der Zeile für ein Token.

Hinweis

Überspringen steht nur den Besprechungsorganisatoren zur Verfügung.

Diese Schritt-für-Schritt-Anleitung hilft Ihnen beim Generieren eines Besprechungstokens für alle Teilnehmer für die Interaktion in der Besprechung. Die folgende Ausgabe wird angezeigt:

Screenshot des letzten Ausgabebildschirms.

Voraussetzungen

19 Minuten verbleibend

Sie installieren die folgenden Tools und richten Ihre Entwicklungsumgebung ein:

	Installieren	Zum Benutzen...
	Microsoft Teams	Microsoft Teams für die Zusammenarbeit mit allen, mit denen Sie arbeiten, über Apps für Chats, Besprechungen und Anrufe an einem Ort.
	Visual Studio 2022	Sie können die Unternehmensversion in Visual Studio 2022 und die Workloads ASP.NET und Webentwicklung installieren. Verwenden Sie die neueste Version.
	Microsoft 365-Entwicklerkonto	Zugriff auf das Teams-Konto mit den entsprechenden Berechtigungen zum Installieren einer App.
	.NET Core SDK Version 3.1	Angepasste Bindungen für lokales Debuggen und Bereitstellungen von Azure Functions-Apps. Wenn Sie das .NET 3.1-SDK (oder höher) nicht global installiert haben, kann die portable Version installiert werden.
	Node.js und NPM	Back-End-JavaScript-Laufzeitumgebung. Weitere Informationen finden Sie unter Node.js Versionskompatibilitätstabelle für den Projekttyp.
	Entwicklungstunnel	Teams-App-Features (Konversationsbots, Nachrichtenerweiterungen und eingehende Webhooks) erfordern eingehende Verbindungen. Ein Tunnel verbindet Ihr Entwicklungssystem mit Teams. Dev Tunnel ist ein leistungsstarkes Tool, um Ihren Localhost sicher für das Internet zu öffnen und zu steuern, wer Zugriff hat. Dev Tunnel ist in Visual Studio 2022 Version 17.7.0 oder höher verfügbar. Oder Sie können ngrok auch als Tunnel verwenden, um Ihr Entwicklungssystem mit Teams zu verbinden. Dies ist nicht für Apps erforderlich, die nur Registerkarten enthalten. Dieses Paket wird im Projektverzeichnis installiert (mit npm `devDependencies`).

Hinweis

Nachdem Sie ngrok heruntergeladen haben, registrieren Sie sich, und installieren Sie authtoken.

Sie müssen über Kenntnisse der folgenden Technologien verfügen:

Einrichten einer lokalen Umgebung

18 Minuten verbleibend

Öffnen Sie Microsoft-Teams-Samples.
Wählen Sie Code aus.
Wählen Sie im Dropdownmenü Mit GitHub Desktop öffnen aus.
Wählen Sie Klonen aus.

Registrieren der Microsoft Entra-App

17 Minuten verbleibend

Die folgenden Schritte helfen Ihnen beim Erstellen und Registrieren Ihres Bots im Azure-Portal:

Erstellen und registrieren Sie Ihre Azure-App.
Erstellen Sie einen geheimen Clientschlüssel, um die SSO-Authentifizierung des Bots zu aktivieren.
Fügen Sie den Teams-Kanal hinzu, um den Bot bereitzustellen.
Erstellen Sie einen Tunnel zu den Endpunkten Ihres Webservers mithilfe von Dev Tunnel (empfohlen) oder ngrok.
Fügen Sie dem von Ihnen erstellten Entwicklungstunnel einen Messagingendpunkt hinzu.

Hinzufügen der App-Registrierung

Navigieren Sie zum Azure-Portal.
Wählen Sie App-Registrierungen aus.
Wählen Sie + Neue Registrierung aus.
Geben Sie den Namen Ihrer App ein.
Wählen Sie Konten in einem beliebigen Organisationsverzeichnis (Beliebiger Microsoft Entra ID-Mandant – Mehrinstanzenfähig) aus.
Wählen Sie Registrieren aus.

Ihre App ist in der Microsoft Entra-ID registriert. Die App-Übersichtsseite wird angezeigt.

Hinweis

Speichern Sie die App-ID unter Anwendungs-ID (Client) und Verzeichnis-ID (Mandant) zur weiteren Verwendung.

Erstellen eines Tunnels

Entwicklungstunnel
ngrok

Öffnen Sie Visual Studio.
Wählen Sie Neues Projekt erstellen aus.
Geben Sie im Suchfeld ASP.NET ein. Wählen Sie in den Suchergebnissen ASP.NET Core Web App aus.
Wählen Sie Weiter aus.
Geben Sie Projektname ein , und wählen Sie Weiter aus.
Wählen Sie Erstellen aus.

Ein Übersichtsfenster wird angezeigt.
Wählen Sie in der Dropdownliste Debug die Option Dev Tunnels (kein aktiver Tunnel)>Tunnel erstellen... aus.

Ein Popupfenster wird geöffnet.
Aktualisieren Sie die folgenden Details im Popupfenster:
1. Konto: Geben Sie ein Microsoft- oder GitHub-Konto ein.
2. Name: Geben Sie einen Namen für Ihren Tunnel ein.
3. Tunneltyp: Wählen Sie in der Dropdownliste die Option Temporär aus.
4. Zugriff: Wählen Sie in der Dropdownliste Öffentlich aus.
Wählen Sie OK aus.

Ein Popupfenster wird angezeigt, in dem angezeigt wird, dass der Entwicklungstunnel erfolgreich erstellt wurde.
Wählen Sie OK aus.

Sie finden den tunnel, den Sie erstellt haben, in der Debug-Dropdownliste wie folgt:
Wählen Sie F5 aus, um die Anwendung im Debugmodus auszuführen.
Wenn ein Dialogfeld Sicherheitswarnung angezeigt wird, wählen Sie Ja aus.

Ein Popupfenster wird geöffnet.
Wählen Sie Weiter.

Die Dev Tunnel-Startseite wird in einem neuen Browserfenster geöffnet, und der Entwicklungstunnel ist jetzt aktiv.
Wechseln Sie zu Visual Studio, und wählen Sie Ausgabe anzeigen >aus.
Wählen Sie im Dropdownmenü Ausgabekonsoledie Option Dev Tunnels aus.

In der Ausgabekonsole wird die Dev Tunnel-URL angezeigt.

Verwenden Sie ngrok oder die Eingabeaufforderung, um einen Tunnel zu den öffentlich verfügbaren HTTPS-Endpunkten Ihres lokal ausgeführten Webservers zu erstellen. Führen Sie den folgenden Befehl in ngrok aus:

ngrok http --host-header=localhost 3978

Tipp

Wenn sie auf ERR_NGROK_4018 stoßen, führen Sie die Schritte in der Eingabeaufforderung aus, um sich zu registrieren und ngrok zu authentifizieren. Führen Sie anschließend den Befehl ngrok http --host-header=localhost 3978 aus.

Im Fenster wird die HTTPS-URL angezeigt.

Screenshot: ngrok-HTTPS-URL

Hinzufügen einer Webauthentifizierung

Wählen Sie im linken Bereich unter Verwalten die Option Authentifizierung aus.
Wählen SiePlattformweb>hinzufügenaus.
Geben Sie den Umleitungs-URI für Ihre App ein, indem Sie an den vollqualifizierten Domänennamen anfügen auth-end . Zum Beispiel https://your-devtunnel-domain/auth-end oder https://your-ngrok-domain/auth-end.
Aktivieren Sie unter Implizite Genehmigung und Hybridflows die Kontrollkästchen Zugriffstoken und ID-Token .
Wählen Sie Konfigurieren aus.
Wählen Sie unter Web die Option URI hinzufügen aus.
https://token.botframework.com/.auth/web/redirect eingeben.
Klicken Sie auf Speichern.

Erstellen eines geheimen Clientschlüssels

Wählen Sie im linken Bereich unter Verwalten die Option Zertifikate & Geheimnisse aus.
Wählen Sie unter Geheime Clientschlüsseldie Option + Neuer geheimer Clientschlüssel aus.

Das Fenster Geheimen Clientschlüssel hinzufügen wird angezeigt.
Geben Sie Beschreibung ein.
Klicken Sie auf Hinzufügen.
Wählen Sie unter Wertdie Option In Zwischenablage kopieren aus, um den Wert des geheimen Clientschlüssels zur weiteren Verwendung zu speichern.

Api-Berechtigung hinzufügen

Wählen Sie im linken Bereich unter Verwalten die Option API-Berechtigungen aus.
Wählen Sie + Berechtigung hinzufügen aus.
Wählen Sie Microsoft Graph aus.
Wählen Sie Delegierte Berechtigungen aus.
Wählen Sie die folgenden Berechtigungen aus:
- OpenId-Berechtigungen>email, offline_access, openid, profile.
- Benutzer>User.Read.
Wählen Sie Berechtigungen hinzufügen aus.
Hinweis
- Wenn einer App keine Zustimmung des IT-Administrators erteilt wird, müssen Benutzer bei der ersten Verwendung einer App ihre Zustimmung erteilen.
- Benutzer müssen den API-Berechtigungen nur zustimmen, wenn die Microsoft Entra-App in einem anderen Mandanten registriert ist.

Hinzufügen des Anwendungs-ID-URI

Wählen Sie im linken Bereich unter Verwalten die Option API verfügbar machen aus.
Wählen Sie neben Anwendungs-ID-URIdie Option Hinzufügen aus.
Aktualisieren Sie den Anwendungs-ID-URI im api://your-devtunnel-domain/botid-{AppID} Format oder api://your-ngrok-domain/botid-{AppID} , und wählen Sie Speichern aus.

Die folgende Abbildung zeigt den Domänennamen:

Hinzufügen eines Bereichs

Wählen Sie im linken Bereich unter Verwalten die Option API verfügbar machen aus.
Wählen Sie + Bereich hinzufügen aus.
Geben Sie access_as_user als Bereichsnamen ein.
Wählen Sie unter Wer kann zustimmen?die Option Administratoren und Benutzer aus.
Aktualisieren Sie die Werte für die restlichen Felder wie folgt:
- Geben Sie Teams kann als Anzeigename der Administratoreinwilligungauf das Profil des Benutzers zugreifen ein.
- Geben Sie Erlaubt Teams das Aufrufen der Web-APIs der App als aktuellen Benutzer als Beschreibung der Administratoreinwilligung ein.
- Geben Sie Teams kann auf das Benutzerprofil zugreifen und Anforderungen im Namen des Benutzers als Anzeigename für die Benutzereinwilligung stellen ein.
- Geben Sie Teams aktivieren ein, um die APIs dieser App mit den gleichen Rechten wie der Benutzer als Beschreibung der Benutzereinwilligung aufzurufen.
Stellen Sie sicher, Zustand auf Aktiviert festgelegt ist.
Klicken Sie auf Bereich hinzufügen.

Die folgende Abbildung zeigt die Felder und die Werte:

Hinweis

Der Bereichsname muss mit dem Anwendungs-ID-URI übereinstimmen, der /access_as_user am Ende angefügt ist.

Hinzufügen einer Clientanwendung

Wählen Sie im linken Bereich unter Verwalten die Option API verfügbar machen aus.

Identifizieren Sie unter Autorisierte Clientanwendungen die Anwendungen, die Sie für die Webanwendung Ihrer App autorisieren möchten.
Wählen Sie + Clientanwendung hinzufügen aus.
Fügen Sie Teams mobile oder Desktop- und Teams-Webanwendung hinzu.
1. Für Teams Mobile oder Desktop: Geben Sie die Client-ID als ein 1fec8e78-bce4-4aaf-ab1b-5451cc387264.
2. Für Teams-Web: Geben Sie die Client-ID als ein 5e3ce6c0-2b1f-4285-8d4b-75ee78787346.
Aktivieren Sie das Kontrollkästchen Autorisierte Bereiche .
Wählen Sie Anwendung hinzufügen aus.

Die folgende Abbildung zeigt die Client-ID:

Aktualisieren des Manifests

Wählen Sie im linken Bereich Manifest aus.
Legen Sie den Wert für auf accessTokenAcceptedVersion fest, 2 und wählen Sie Speichern aus.

Erstellen Ihres Bots

12 Minuten verbleibend

Erstellen einer Azure-Botressource

Hinweis

Wenn Sie Ihren Bot bereits in Teams testen, melden Sie sich von dieser App und Von Teams ab. Melden Sie sich erneut an, um diese Änderung anzuzeigen.

Wechseln Sie zu Startseite.
Wählen Sie + Ressource erstellen aus.
Geben Sie in das Suchfeld Azure Bot ein.
Drücken Sie die EINGABETASTE.
Wählen Sie Azure Bot aus.
Wählen Sie Erstellen aus.
Geben Sie den Botnamen im Bothandle ein.
Wählen Sie Ihr Abonnement aus der Dropdownliste aus.
Wählen Sie Ihre Ressourcengruppe aus der Dropdownliste aus.

Wenn Sie nicht über eine vorhandene Ressourcengruppe verfügen, können Sie eine neue Ressourcengruppe erstellen. Führen Sie die folgenden Schritte aus, um eine neue Ressourcengruppe zu erstellen:
1. Wählen Sie Neu erstellen aus.
2. Geben Sie den Ressourcennamen ein, und wählen Sie OK aus.
3. Wählen Sie in der Dropdownliste Neuer Ressourcengruppenstandort einen Standort aus.
Wählen Sie unter Preise die Option Plan ändern aus.
Wählen Sie FO Free>Select aus.
Wählen Sie unter Microsoft App-IDdie Option App-Typ als mehrinstanzenfähig aus.
Wählen Sie unter Erstellungstyp die Option Vorhandene App-Registrierung verwenden aus.
Geben Sie die App-ID ein.

Hinweis

Sie können nicht mehr als einen Bot mit derselben Microsoft-App-ID erstellen.
Wählen Sie Überprüfen + erstellen aus.
Nachdem die Überprüfung erfolgreich war, wählen Sie Erstellen aus.

Die Bereitstellung des Bots dauert einige Minuten.
Wählen Sie Zu Ressource wechseln aus.

Sie haben Ihren Azure-Bot erfolgreich erstellt.

Hinzufügen eines Teams-Kanals

Wählen Sie im linken Bereich Kanäle aus.
Wählen Sie unter Verfügbare Kanäledie Option Microsoft Teams aus.
Aktivieren Sie das Kontrollkästchen, um die Nutzungsbedingungen zu akzeptieren.
Wählen Sie Zustimmen aus.
Wählen Sie Anwenden aus.

So fügen Sie einen Messagingendpunkt hinzu

Entwicklungstunnel
ngrok

Verwenden Sie die Dev Tunnel-URL in der Ausgabekonsole als Messagingendpunkt.
Wählen Sie im linken Bereich unter Einstellungen die Option Konfiguration aus.
Aktualisieren Sie den Messagingendpunkt im Format https://your-devtunnel-domain/api/messages.
Wählen Sie Anwenden aus.

Sie haben erfolgreich einen Bot im Azure Bot-Dienst eingerichtet.

Hinweis

Wenn der Application Insights-Instrumentierungsschlüssel einen Fehler anzeigt, aktualisieren Sie mit der App-ID.

Kopieren Sie in ngrok die HTTPS-URL.

Hinweis

Die HTTPS-URL in Ihrem ngrok ist Ihr vollqualifizierter Domänenname. ist WebAppDomain ein vollqualifizierter Domänenname, der nicht enthalten https:// ist.
Wählen Sie im linken Bereich unter Einstellungen die Option Konfiguration aus.
Aktualisieren Sie den Messagingendpunkt im Format https://your-ngrok-domain/api/messages.
Wählen Sie Anwenden aus.

Sie haben erfolgreich einen Bot im Azure Bot-Dienst eingerichtet.

Hinweis

Wenn der Application Insights-Instrumentierungsschlüssel eine Fehleraktualisierung mit der App-ID anzeigt.

Einrichten von App-Einstellungen

7 Minuten verbleibend

Wechseln Sie zur appsettings.json-Datei im geklonten Repository.
Öffnen Sie die appsettings.json-Datei in Visual Studio Code , und aktualisieren Sie die folgenden Informationen:
- Legen Sie "MicrosoftAppId" auf die Microsoft-App-ID Ihres Bots fest.
- Legen Sie "MicrosoftAppPassword" auf den geheimen ClientschlüsselWert Ihres Bots fest.
- Legen Sie "AzureAd"."TenantId" auf die Mandanten-ID des Mandanten fest, in dem die App verwendet wird.
Hinweis

Das Beispiel funktioniert nur im aktuellen Mandanten.
- Legen Sie "AzureAd"."ApplicationId" auf die Microsoft-App-ID Ihres Bots fest.
- Legen Sie "ContentBubbleUrl" auf die iframe-URL (https://[WebAppDomain]/contentBubble.html)der Inhaltsblase fest.
Hinweis

WebAppDomain ist Ihre ngrok-Domäne, sodass die URL der Inhaltsblase ähnlich https://ae57****.ngrok.io/contentBubble.htmlist.

Einrichten der Manifestdatei

6 Minuten verbleibend

Wechseln Sie zur manifest.json Datei im geklonten Repository.
Öffnen Sie manifest.json die Datei in Visual Studio Code , und nehmen Sie die folgenden Änderungen vor:
- Legen Sie auf die neueste Version fest manifestVersion .
- Legen Sie auf fest $schemahttps://developer.microsoft.com/json-schemas/teams/v1.11/MicrosoftTeams.schema.json.
- Legen Sie auf fest resourceapi://[WebAppDomainName]/[MicrosoftAppId].
- Ersetzen Sie durch [companyName]Contoso.
- Ersetzen Sie die folgenden Abschnitte durch Ihren vollqualifizierten Domänennamen:
  - websiteUrl
  - privacyUrl
  - termsOfUseUrl
- Ersetzen Sie alle Vorkommen von WebAppDomainName durch Ihren ngrok-Domänennamen.
- Ersetzen Sie alle Vorkommen von MicrosoftAppId durch die Microsoft App-ID Ihres Bots.

Erstellen einer Client-App mit npm install

5 Minuten verbleibend

Wechseln Sie im geklonten Repository zum Ordner ClientApp .
Kopieren Sie den Ordnerpfad ClientApp .
Öffnen Sie ein neues Eingabeaufforderungsfenster , und ändern Sie das aktuelle Verzeichnis in den kopierten ClientApp-Pfad .
Führen Sie den folgenden Befehl in der Eingabeaufforderung aus , um Pakete und Abhängigkeiten herunterzuladen.
```
npm install
```
Führen Sie den folgenden Befehl in der Eingabeaufforderung aus , um die App zu starten.
```
npm start
```

Erstellen und Ausführen des Diensts

4 Minuten verbleibend

Verwenden Sie Visual Studio oder die Befehlszeile, um den Dienst zu erstellen und auszuführen.

Visual Studio
Befehlszeile

Öffnen Sie Visual Studio.
Wechseln Sie zu Datei>Projekt>/Projektmappe öffnen....
Wählen Sie im Ordner csharp die Datei TokenApp.csproj aus.
Press F5 to run the project.
Wählen Sie Ja aus, wenn das folgende Dialogfenster angezeigt wird:

Eine Webseite wird mit der Meldung App ist bereit! geöffnet.

Wechseln Sie in einem Eingabeaufforderungsfenster zum Ordner csharp , und geben Sie den folgenden Befehl ein:

 dotnet run

Screenshot: Eingabeaufforderung – dotnet run

Entwicklervorschau aktivieren

3 Minuten verbleibend

Aktivieren Sie das Hochladen von Apps in der Verwaltungskonsole Ihres Mandanten.
1. Melden Sie sich mit Ihren Administratoranmeldeinformationen beim Microsoft 365 Admin Center an.
2. Wählen Sie im linken Bereich Alle anzeigen aus.
3. Wählen Sie Teams aus.
4. Wählen Sie im linken Bereich Teams-Apps aus.
5. Wählen Sie Setuprichtlinien aus.
6. Wählen Sie Global aus.
7. Aktivieren Sie On position in Upload custom apps (Benutzerdefinierte Apps hochladen).
8. Klicken Sie auf Speichern.
  
  Ihr Testmandant kann den Upload benutzerdefinierter Apps zulassen.
  
  Hinweis
  
  Der Upload benutzerdefinierter Apps dauert einige Zeit, bis er aktiv wird.
Wechseln Sie zu Microsoft Teams.
Wählen Sie in der oberen rechten Ecke Ihrer Teams-Benutzeroberfläche Einstellungen und mehr(...) aus.
Wählen Sie Über>Entwicklervorschauaus.
Wählen Sie Zur Entwicklervorschau wechseln aus.

Hinzufügen eines Besprechungstokens zu Teams

2 Minuten verbleibend

Navigieren Sie in Ihrem geklonten Repository zu csharp > AppManifest.
Erstellen Sie eine .zip-Datei mit den folgenden Dateien, die im Ordner AppManifest vorhanden sind:
- manifest.json
- outline.png
- color.png
Erstellen Sie eine Besprechung in Teams mit einigen Referenten und Teilnehmern.
Nehmen Sie an der Besprechung teil.
Nachdem die Besprechung gestartet wurde, wählen Sie Apps aus.
Wählen Sie im Popupfenster Apps verwalten aus.
Wählen Sie App hochladen aus.
Wählen Sie die .zip Datei aus, die Sie im Ordner AppManifest erstellt haben, und wählen Sie Öffnen aus.
Klicken Sie auf Hinzufügen.

Im Abschnitt Apps verwalten wird die Liste der Anwendungen angezeigt.
Wechseln Sie zu Teams-Besprechung.
Wählen Sie App-Symbol aus. Auf der App-Auswahlseite wird die App als Besprechungstoken-App angezeigt.
Wählen Sie Besprechungstoken-App aus.
Klicken Sie auf Speichern.

Die App wird im Besprechungschat angezeigt.
Starten Sie die Besprechung.

Das Symbol wird in der Besprechungssteuerungsleiste angezeigt.

Hinweis

Wenn Sie an Ihrem eigenen Projekt arbeiten, stellen Sie sicher, dass Sie einen permanenten Speichermechanismus verwenden, um die Tokeninformationen und die Dienst-URL für den Mandanten zu speichern.