Such-Widget auf einer Webseite einfügen

Auf dieser Seite wird beschrieben, wie Sie einer Website mithilfe des Such-Widgets eine Suchfunktion hinzufügen.

Hinweise

Bevor Sie Ihrer Website ein Such-Widget hinzufügen, müssen Sie es konfigurieren. Beginnen Sie mit Ergebnisse für das Such-Widget konfigurieren. Das Styling des Such-Widgets auf Ihrer Webseite kann nicht angepasst werden.

Prozeduren

Wie Sie das Such-Widget auf Ihrer Webseite einfügen, hängt vom ausgewählten Autorisierungstyp ab:

  • Autorisierungstoken: Das Widget verwendet ein von Ihrer Codebasis bereitgestelltes JWT- oder OAuth-Token. Sie benötigen einen eigenen Server, mit dem Sie ein Token generieren können. Mit dem Autorisierungstoken wird ein API-Aufruf im Namen des Nutzers oder Dienstkontos ausgeführt. Verwenden Sie beim Generieren des Authentifizierungstokens den OAuth-Bereich https://www.googleapis.com/auth/cloud-platform.

  • Öffentlicher Zugriff: Das Widget schränkt nicht ein, wer Ergebnisse aus einer Suchanfrage erhalten kann.

Widget mit Autorisierungstoken hinzufügen

  1. Rufen Sie in der Google Cloud Console die Seite Agent Builder auf.

    Zum Agent Builder

  2. Klicken Sie auf den Namen der App, die Sie bearbeiten möchten.

  3. Klicken Sie auf Integration.

  4. Klicken Sie auf den Tab Widget.

  5. Wählen Sie als Widget-Autorisierungstyp JWT- oder OAuth-basiert aus.

  6. Geben Sie den Domainnamen für die Widget-Seite an:

    1. Geben Sie den Domainnamen der Seite ein, auf der das Widget angezeigt werden soll.

      Wenn Sie beispielsweise das Widget auf die Seiten example.com/ai.html und cymbal.example.com/search.html kopieren möchten, geben Sie example.com als Domain ein. Wenn das Widget nur auf einer Seite in der Subdomain funktionieren soll, geben Sie cymbal.example.com ein.

      Wenn Sie das Widget auf Ihrem lokalen Host testen möchten, geben Sie localhost ein.

    2. Klicken Sie auf Hinzufügen.

  7. Wiederholen Sie Schritt 6 für jede Domain, auf der das Widget angezeigt werden soll.

  8. Klicken Sie auf Speichern.

  9. Kopieren Sie das Code-Snippet im Abschnitt Kopieren Sie den folgenden Code in Ihre Webanwendung.

  10. Generieren Sie in der Codebasis ein Autorisierungstoken.

  11. Um das Autorisierungstoken an Ihr Widget zu übergeben, verwenden Sie das zweite Code-Snippet „// Set authorization token“ im Abschnitt Kopieren Sie den folgenden Code in Ihre Webanwendung und ersetzen Sie den Text <JWT or OAuth token provided by you backend> durch Ihr Autorisierungstoken.

  12. Legen Sie regelmäßig ein neues Token fest, indem Sie den vorherigen Schritt wiederholen, bevor das aktuelle Token abläuft.

Widget mit öffentlichem Zugriff hinzufügen

  1. Rufen Sie in der Google Cloud Console die Seite Agent Builder auf.

    Zum Agent Builder

  2. Klicken Sie auf den Namen der App, die Sie bearbeiten möchten.

    Achten Sie beim öffentlichen Zugriff darauf, dass die Such-App unter Zugriffssteuerung keinem Datenspeicher zugeordnet ist.

  3. Klicken Sie auf Integration.

  4. Klicken Sie auf den Tab Widget.

  5. Wählen Sie als Widget-Autorisierungstyp Öffentlicher Zugriff aus.

  6. Geben Sie den Domainnamen für die Widget-Seite an:

    1. Geben Sie den Domainnamen der Seite ein, auf der das Widget angezeigt werden soll.

      Wenn Sie beispielsweise das Widget auf die Seiten example.com/ai.html und cymbal.example.com/search.html kopieren möchten, geben Sie example.com als Domain ein. Wenn das Widget nur auf Seiten in der Subdomain funktionieren soll, geben Sie cymbal.example.com ein.

      Wenn Sie das Widget auf Ihrem lokalen Host testen möchten, geben Sie localhost ein.

    2. Klicken Sie auf Hinzufügen.

  7. Wiederholen Sie Schritt 6 für jede Domain, auf der das Widget angezeigt werden soll.

  8. Klicken Sie auf Speichern.

  9. Kopieren Sie das Code-Snippet im Abschnitt Kopieren Sie den folgenden Code in Ihre Webanwendung und fügen Sie es auf Ihrer Webseite ein.