Um einen Wechsel zwischen den Kontexten zu verhindern, wenn Nutzer einen Link in Google Chat teilen, kann die Chat-App den Link in der Vorschau ansehen. Dazu wird eine Karte an die Nachricht angehängt, die mehr Informationen enthält und die Nutzer direkt in Google Chat Aktionen ausführen können.
Stellen Sie sich zum Beispiel einen Google Chat-Bereich vor, der alle Kundenservicemitarbeiter eines Unternehmens sowie eine Chat-App namens Case-y enthält. Kundenservicemitarbeiter teilen häufig Links zu Kundendienstanfragen im Chatbereich und ihre Kollegen müssen bei jeder Anfrage den Link für den Fall öffnen, um Details wie zuständige Person, Status und Betreff zu sehen. Wenn jemand die Bearbeitung einer Anfrage übernehmen oder den Status ändern möchte, muss er den Link öffnen.
Mithilfe der Linkvorschau kann die Chat-App Case-y des Gruppenbereichs eine Karte mit der zuständigen Person, dem Status und dem Betreff anhängen, wenn jemand einen Falllink teilt. Über Schaltflächen auf der Karte können Kundenservicemitarbeiter die Anfrage übernehmen und den Status direkt über den Chatstream ändern.
Funktionsweise der Linkvorschau
Wenn jemand seiner Nachricht einen Link hinzufügt, wird ein Chip mit dem Hinweis angezeigt, dass in einer Chat-App möglicherweise eine Vorschau des Links angezeigt wird.
Nach dem Senden der Nachricht wird der Link an die Chat-App gesendet, die die Karte erstellt und an die Nachricht des Nutzers anhängt.
Neben dem Link enthält die Karte zusätzliche Informationen zum Link, einschließlich interaktiver Elemente wie Schaltflächen. Ihre Chat-App kann die angehängte Karte als Reaktion auf Nutzerinteraktionen wie Klicks auf Schaltflächen aktualisieren.
Wenn jemand nicht möchte, dass in der Chat-App eine Vorschau des Links angezeigt wird, indem an seine Nachricht eine Karte angehängt wird, kann er dies verhindern, indem er auf dem Vorschau-Chip auf
klickt. Nutzer können die angehängte Karte jederzeit entfernen, indem sie auf Vorschau entfernen klicken.Linkvorschau konfigurieren
Registrieren Sie bestimmte Links wie example.com
, support.example.com
und support.example.com/cases/
als URL-Muster auf der Konfigurationsseite Ihrer Chat-App in der Google Cloud Console, damit Ihre Chat-App sie als Vorschau ansehen kann.
- Öffnen Sie die Google Cloud Console.
- Klicken Sie neben „Google Cloud“ auf den Abwärtspfeil und öffnen Sie das Projekt der Chat-App.
- Geben Sie in das Suchfeld
Google Chat API
ein und klicken Sie auf Google Chat API. - Klicken Sie auf Verwalten > Konfiguration.
- Fügen Sie unter „Linkvorschau“ ein URL-Muster hinzu oder bearbeiten Sie es.
- Wenn Sie die Linkvorschau für ein neues URL-Muster konfigurieren möchten, klicken Sie auf URL-Muster hinzufügen.
- Wenn Sie die Konfiguration für ein vorhandenes URL-Muster bearbeiten möchten, klicken Sie auf den Drop-down-Pfeil .
Geben Sie die Domain des URL-Musters in das Feld Host-Muster ein. In der Chat-App werden Links zu dieser Domain als Vorschau angezeigt.
Wenn Sie die Vorschaulinks für die Chat App für eine bestimmte Subdomain wie
subdomain.example.com
sehen möchten, geben Sie die Subdomain an.Wenn die Vorschaulinks für die Chat-App für die gesamte Domain angezeigt werden sollen, geben Sie ein Platzhalterzeichen mit einem Sternchen (*) als Subdomain an. Beispiel:
*.example.com
stimmt mitsubdomain.example.com
undany.number.of.subdomains.example.com
überein.Geben Sie im Feld Pfadpräfix den Pfad ein, der an die Domain des Hostmusters angehängt werden soll.
Wenn alle URLs in der Domain mit Hostmustern abgeglichen werden sollen, lassen Sie das Feld Pfadpräfix leer.
Wenn das Hostmuster beispielsweise
support.example.com
lautet, geben Siecases/
ein, um URLs für Fälle abzugleichen, die untersupport.example.com/cases/
gehostet werden.Klicken Sie auf Fertig.
Klicken Sie auf Speichern.
Wenn jetzt jemand einen Link einfügt, der mit einem Muster für die Linkvorschau-URL einer Nachricht in einem Chatbereich mit Ihrer Chat App übereinstimmt, wird in der App eine Vorschau angezeigt.
Vorschau eines Links anzeigen
Nachdem Sie die Linkvorschau für einen bestimmten Link konfiguriert haben, kann Ihre Chat-App den Link erkennen und als Vorschau anzeigen, indem weitere Informationen angehängt werden.
Wenn eine Nachricht in Chatbereichen, die Ihre Chat-App enthalten, einen Link enthält, der einem URL-Muster für die Linkvorschau entspricht, empfängt Ihre Chat-App ein MESSAGE
-Interaktionsereignis. Die JSON-Nutzlast für das Interaktionsereignis enthält das Feld matchedUrl
:
JSON
"message": {
. . . // other message attributes redacted
"matchedUrl": {
"url": "https://support.example.com/cases/case123"
},
. . . // other message attributes redacted
}
Wenn das Feld matchedUrl
in der Nutzlast des Ereignisses MESSAGE
vorhanden ist, kann die Chat-App der Nachricht über den Vorschaulink Informationen hinzufügen. Ihre Chat-App kann entweder mit einer einfachen Textnachricht antworten oder eine Karte anhängen.
Mit einer SMS antworten
Bei einfachen Antworten kann Ihre Chat-App eine Vorschau eines Links anzeigen, indem sie mit einer einfachen Textnachricht auf einen Link antwortet. In diesem Beispiel wird eine Nachricht angehängt, in der die Link-URL wiederholt wird, die einem URL-Muster für die Linkvorschau entspricht.
Node.js
Apps Script
Karte anhängen
Um eine Karte an einen Vorschaulink anzuhängen, gib eine ActionResponse
vom Typ UPDATE_USER_MESSAGE_CARDS
zurück. In diesem Beispiel wird eine einfache Karte angehängt.
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht durch Rückgabe von Karten-JSON gesendet. Sie können auch den Apps Script-Kartendienst verwenden.
Karte aktualisieren
Wenn du die mit einem Vorschaulink verknüpfte Karte aktualisieren möchtest, gib ein ActionResponse
-Objekt vom Typ UPDATE_USER_MESSAGE_CARDS
zurück. Chat-Apps können nur Karten aktualisieren, die Links als Antwort auf ein Interaktionsereignis einer Chat-App anzeigen.
Chat-Apps können diese Karten nicht durch asynchrones Aufrufen der Chat API aktualisieren.
Die Linkvorschau unterstützt die Rückgabe eines ActionResponse
-Objekts vom Typ UPDATE_MESSAGE
nicht. Da UPDATE_MESSAGE
die gesamte Nachricht und nicht nur die Karte aktualisiert, funktioniert das nur, wenn die ursprüngliche Nachricht von der Chat-App erstellt wurde. In der Linkvorschau wird an eine vom Nutzer erstellte Nachricht eine Karte angehängt. Die Chat-App ist daher nicht berechtigt, sie zu aktualisieren.
Damit eine Funktion sowohl von Nutzern erstellte als auch von Apps erstellte Karten im Chatstream aktualisiert, legen Sie ActionResponse
dynamisch fest, je nachdem, ob die Chat-App oder ein Nutzer die Nachricht erstellt hat.
- Wenn die Nachricht von einem Nutzer erstellt wurde, legen Sie
ActionResponse
aufUPDATE_USER_MESSAGE_CARDS
fest. - Wenn die Nachricht von einer Chat-App erstellt wurde, legen Sie den
ActionResponse
aufUPDATE_MESSAGE
fest.
Dafür gibt es zwei Möglichkeiten: Sie können ein benutzerdefiniertes actionMethodName
als Teil der onclick
-Eigenschaft der angehängten Karte angeben und prüfen, ob es von einem Nutzer erstellt wurde. Damit wird die Nachricht als vom Nutzer erstellt gekennzeichnet.
Option 1: Prüfen Sie, ob actionMethodName
vorhanden ist.
Damit actionMethodName
für die korrekte Verarbeitung von CARD_CLICKED
-Interaktionsereignissen auf Karten in der Vorschau verwendet werden kann, müssen Sie ein benutzerdefiniertes actionMethodName
als Teil der onclick
-Eigenschaft der angehängten Karte festlegen:
JSON
. . . // Preview card details
{
"textButton": {
"text": "ASSIGN TO ME",
"onClick": {
// actionMethodName identifies the button to help determine the
// appropriate ActionResponse.
"action": {
"actionMethodName": "assign",
}
}
}
}
. . . // Preview card details
Wenn "actionMethodName": "assign"
die Schaltfläche als Teil einer Linkvorschau identifiziert, ist es möglich, das richtige ActionResponse
dynamisch zurückzugeben, indem nach einer übereinstimmenden actionMethodName
gesucht wird:
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht durch Rückgabe von Karten-JSON gesendet. Sie können auch den Apps Script-Kartendienst verwenden.
Option 2: Absendertyp überprüfen
Prüfen Sie, ob message.sender.type
den Wert HUMAN
oder BOT
hat. Wenn HUMAN
, setzen Sie ActionResponse
auf UPDATE_USER_MESSAGE_CARDS
, andernfalls ActionResponse
auf UPDATE_MESSAGE
. Das geht so:
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht durch Rückgabe von Karten-JSON gesendet. Sie können auch den Apps Script-Kartendienst verwenden.
Ein typischer Grund für die Aktualisierung einer Karte ist ein Klick auf eine Schaltfläche. Rufen Sie sich noch einmal die Schaltfläche Mir zuweisen aus dem vorigen Abschnitt Karte hinzufügen ins Gedächtnis. Im folgenden Beispiel wird die Karte so aktualisiert, dass sie „Ihnen“ zugewiesen wird, nachdem der Nutzer auf Mir zuweisen geklickt hat. In diesem Beispiel wird ActionResponse
dynamisch festgelegt, indem der Absendertyp geprüft wird.
Vollständiges Beispiel: Case-y, die Chat-App für den Kundenservice
Hier ist der vollständige Code für Case-y, eine Chat-App, die Links zu Anfragen in einem Chatbereich anzeigt, in dem Kundenservicemitarbeiter zusammenarbeiten.
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht durch Rückgabe von Karten-JSON gesendet. Sie können auch den Apps Script-Kartendienst verwenden.
Limits und Überlegungen
Beachten Sie beim Konfigurieren der Linkvorschau für Ihre Chat-App die folgenden Beschränkungen und Hinweise:
- Jede Chat-App unterstützt eine Linkvorschau für bis zu fünf URL-Muster.
- Chat-Apps zeigen eine Vorschau eines Links pro Nachricht an. Wenn in einer Nachricht mehrere Links als Vorschau verfügbar sind, wird nur der erste Link in der Vorschau angezeigt.
- Chat-Apps zeigen nur Links an, die mit
https://
beginnen. Daher wird inhttps://support.example.com/cases/
eine Vorschau angezeigt,support.example.com/cases/
jedoch nicht. - Sofern die Nachricht keine anderen Informationen enthält, die an die Chat-App gesendet werden, z. B. mit einem Slash-Befehl, wird nur die Link-URL über die Linkvorschau an die Chat App gesendet.
- An Vorschaulinks angehängte Karten unterstützen nur
ActionResponse
vom TypUPDATE_USER_MESSAGE_CARDS
und nur als Reaktion auf eine Interaktion in der Chat-App. In der Linkvorschau werden keineUPDATE_MESSAGE
- oder asynchronen Anfragen zum Aktualisieren von Karten unterstützt, die über die Chat API an einen Vorschaulink angehängt sind. Weitere Informationen finden Sie unter Karte aktualisieren.
Fehler in Linkvorschau beheben
Wenn Sie die Linkvorschau implementieren, müssen Sie möglicherweise Fehler in der Chat-App beheben. Lesen Sie dazu die Protokolle der App. Rufen Sie zum Lesen der Logs den Log-Explorer in der Google Cloud Console auf.