Um zu verhindern, dass beim Teilen eines Links in Google Chat der Kontext gewechselt wird, kann in der Chat App eine Vorschau des Links angezeigt werden. Dazu wird eine Karte an die Nachricht angehängt, die weitere Informationen enthält und Nutzern ermöglicht, direkt in Google Chat Aktionen auszuführen.
Stellen Sie sich beispielsweise einen Google Chat-Bereich vor, der alle Kundenservicemitarbeiter eines Unternehmens und eine Chat-App namens Case-y enthält. Kundenservicemitarbeiter teilen häufig Links zu Kundenserviceanfragen im Chatbereich. Jedes Mal, wenn ihre Kollegen den Fall öffnen, müssen sie den Link öffnen, um Details wie zuständige Person, Status und Betreff zu sehen. Ähnlich verhält es sich, wenn jemand die Bearbeitung eines Falls übernehmen oder den Status ändern möchte. In diesem Fall muss er den Link öffnen.
Mit der Linkvorschau kann die Chat-App des Gruppenbereichs Case-Y immer dann eine Karte anhängen, auf der die zuständige Person, der Status und das Thema des Gruppenbereichs angezeigt wird, wenn jemand einen Link zu einem Fall teilt. Über die Schaltflächen auf der Karte können Kundenservicemitarbeiter die Bearbeitung der Anfrage übernehmen und den Status direkt über den Chatstream ändern.
Funktionsweise der Linkvorschau
Wenn jemand einer Nachricht einen Link hinzufügt, wird ein Chip angezeigt, der darauf hinweist, dass eine Chat-App den Link als Vorschau ansehen kann.
Nach dem Senden der Nachricht wird der Link an die Chat-App gesendet, die dann die Karte generiert 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. Die Chat-App kann die angehängte Karte als Reaktion auf Nutzerinteraktionen wie Klicks auf Schaltflächen aktualisieren.
Wenn ein Nutzer nicht möchte, dass in der Chat App eine Vorschau des Links durch das Hinzufügen einer Karte an die Nachricht angezeigt wird, kann er die Vorschau verhindern, indem er auf dem Vorschau-Chip auf das
klickt. Nutzer können die angehängte Karte jederzeit entfernen, indem sie auf Vorschau entfernen klicken.Vorbereitung
Node.js
Eine Google Chat App mit aktivierten interaktiven Funktionen. So erstellen Sie ein Chat-App mit einem HTTP-Dienst verwenden können, führen Sie diese Kurzanleitung aus.
Apps Script
Eine Google Chat App mit aktivierten interaktiven Funktionen. So erstellen Sie ein interaktive Chat-App in Apps Script verwenden möchten, führen Sie diese Kurzanleitung aus.
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 sich die Chat-App sie in der Vorschau ansehen kann.
- Öffnen Sie die Google Cloud Console.
- Neben „Google Cloud“ Klicken Sie auf den Abwärtspfeil und öffnen Sie das Projekt Ihrer 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 Abwärtspfeil .
Geben Sie in das Feld Hostmuster die Domain des URL-Musters ein. In der Chat App werden Links zu dieser Domain in der Vorschau angezeigt.
Wenn Sie Vorschaulinks für die Chat-App für eine bestimmte Subdomain wie
subdomain.example.com
sehen möchten, müssen Sie auch diese angeben.Wenn Sie Vorschaulinks für die Chat-App für die gesamte Domain sehen möchten, geben Sie für die Subdomain ein Platzhalterzeichen mit einem Sternchen (*) ein.
*.example.com
stimmt beispielsweise mitsubdomain.example.com
undany.number.of.subdomains.example.com
überein.Geben Sie im Feld Pfadpräfix einen Pfad ein, der an die Hostmusterdomain angehängt werden soll.
Lassen Sie das Pfadpräfix leer, damit alle URLs in der Hostmusterdomain übereinstimmen.
Wenn das Hostmuster beispielsweise
support.example.com
ist, 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 URL-Muster für die Linkvorschau zu einer Nachricht in einem Chatbereich mit Ihrer Chat-App übereinstimmt, wird eine Vorschau des Links in der App angezeigt.
Vorschau eines Links anzeigen
Nachdem Sie die Linkvorschau für einen bestimmten Link konfiguriert haben, Die Chat-App kann den Link erkennen und sich eine Vorschau anzeigen lassen, indem das Hinzufügen weiterer Informationen.
In Chatbereichen, die Ihr
Chat-App: Wenn die Nachricht eines Nutzers einen Link enthält,
mit einem URL-Muster für die Linkvorschau übereinstimmt, wird Ihre Chat-App
erhält ein
MESSAGE
-Interaktionsereignis. Die JSON-Datei
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
}
Durch Prüfen, ob das Feld matchedUrl
im Ereignis MESSAGE
vorhanden ist
kann Ihre Chat-App Informationen zum
mit dem Vorschaulink. Ihre Chat-App kann
antworten Sie entweder mit einer einfachen SMS oder hängen Sie eine Karte an.
Mit einer SMS antworten
Für einfache Antworten kann in der Chat App eine Vorschau eines Links angezeigt werden Mit einer einfachen Textnachricht antworten zu einem Link. In diesem Beispiel wird eine Nachricht angehängt, in der die Link-URL stimmt mit einem URL-Muster für die Linkvorschau überein.
Node.js
Apps Script
Karte anhängen
So hängen Sie eine Karte an einen Vorschaulink an:
eine
ActionResponse
vom Typ UPDATE_USER_MESSAGE_CARDS
. In diesem Beispiel wird eine einfache Karte angehängt.
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht gesendet, JSON-Karte Sie können auch die Apps Script-Kartendienst
Karte aktualisieren
Um die Karte zu aktualisieren, die mit einem Vorschau-Link verknüpft ist, geben Sie eine
ActionResponse
vom Typ UPDATE_USER_MESSAGE_CARDS
. Chat-Apps können nur aktualisiert werden
Karten mit Vorschau-Links als Antwort auf eine
Chat-App-Interaktionsereignis.
Chat-Apps können diese Karten nicht durch Aufrufen der Chat API aktualisieren
asynchron programmiert.
Bei der Linkvorschau wird die Rückgabe eines ActionResponse
des Typs UPDATE_MESSAGE
nicht unterstützt. Da UPDATE_MESSAGE
die gesamte Nachricht und nicht nur die Karte aktualisiert, funktioniert das nur, wenn die Chat-App die ursprüngliche Nachricht erstellt hat. Bei der Linkvorschau wird eine Karte an eine vom Nutzer erstellte Nachricht angehängt. Die Chat App ist daher nicht berechtigt, sie zu aktualisieren.
Damit eine Funktion sowohl von Nutzern als auch von Apps erstellte Karten im Chatstream aktualisiert, legen Sie den ActionResponse
je nachdem, ob die Chat App oder ein Nutzer die Nachricht erstellt hat, dynamisch fest.
- Wenn ein Nutzer die Nachricht erstellt hat, setzen Sie
ActionResponse
aufUPDATE_USER_MESSAGE_CARDS
. - Wenn die Nachricht von einer Chat-App erstellt wurde, legen Sie
ActionResponse
aufUPDATE_MESSAGE
fest.
Dafür gibt es zwei Möglichkeiten: Du kannst ein benutzerdefiniertes actionMethodName
als Teil der onclick
-Eigenschaft der angehängten Karte angeben und prüfen, ob es sich um eine benutzerdefinierte Nachricht handelt (die die Nachricht als vom Nutzer erstellt identifiziert), oder du prüfst, ob die Nachricht von einem Nutzer erstellt wurde.
Option 1: Auf actionMethodName
prüfen
Wenn Sie actionMethodName
für die korrekte Verarbeitung von CARD_CLICKED
-Interaktionsereignissen auf Vorschaukarten verwenden möchten, legen Sie in der Eigenschaft onclick
der angehängten Karte ein benutzerdefiniertes actionMethodName
fest:
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, kann das richtige ActionResponse
dynamisch zurückgegeben werden, indem nach einer übereinstimmenden actionMethodName
gesucht wird:
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht gesendet, JSON-Karte Sie können auch die Apps Script-Kartendienst
Option 2: Absendertyp prüfen
Prüfen Sie, ob message.sender.type
HUMAN
oder BOT
ist. Bei HUMAN
setzen Sie ActionResponse
auf UPDATE_USER_MESSAGE_CARDS
. Setzen Sie andernfalls ActionResponse
auf UPDATE_MESSAGE
. So gehts:
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht gesendet, JSON-Karte Sie können auch die Apps Script-Kartendienst
Ein typischer Grund für die Aktualisierung einer Karte ist das Klicken auf eine Schaltfläche. Erinnern Sie sich noch einmal an die Schaltfläche Zuweisen aus dem vorherigen Abschnitt Karte anhängen. Im folgenden vollständigen Beispiel wird die Karte so aktualisiert, dass sie „Ihnen“ zugewiesen ist. nachdem ein Nutzer auf Mir zuweisen geklickt hat. Im 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 mit Links zu Anfragen, die in einem Chatbereich freigegeben wurden, in dem Kundenservicemitarbeiter zusammenarbeiten.
Node.js
Apps Script
In diesem Beispiel wird eine Kartennachricht gesendet, JSON-Karte Sie können auch die Apps Script-Kartendienst
Einschränkungen und Hinweise
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 sehen in der Vorschau einen Link pro Nachricht. Wenn eine einzelne Nachricht mehrere Vorschaulinks enthält, wird nur für den ersten Link eine Vorschau angezeigt.
- In Chat-Apps sehen Sie nur Vorschaulinks, die mit
https://
beginnen. Daher sehen Siehttps://support.example.com/cases/
eine Vorschau an,support.example.com/cases/
jedoch nicht. - Sofern die Nachricht keine anderen Informationen enthält, die an die Chat-App gesendet werden, z. B. einen Slash-Befehl, wird nur die Link-URL über eine Linkvorschau an die Chat App gesendet.
- Karten, die an Vorschaulinks angehängt sind, unterstützen nur ein
ActionResponse
vom TypUPDATE_USER_MESSAGE_CARDS
und nur als Reaktion auf ein Chat-App-Interaktionsereignis. In der Linkvorschau werden wederUPDATE_MESSAGE
noch asynchrone 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.
Linkvorschauen beheben
Wenn Sie die Linkvorschau implementieren, müssen Sie möglicherweise die Fehler in der Chat-App beheben, indem Sie die Protokolle der App lesen. Um die Logs zu lesen, rufen Sie den Log-Explorer in der Google Cloud Console auf.