Talk-to-Slack die Beispiel-Webanwendung

Es ist sehr einfach, eine einfache Webanwendung zu erstellen, die ein LLM mit dem Benutzerwissen durch Abfragen an Rememberizer integriert.

Der Quellcode der App ist hier zu finden.

In diesem Abschnitt geben wir Schritt-für-Schritt-Anleitungen und den vollständigen Quellcode, damit Sie schnell Ihre eigene Anwendung erstellen können.

Wir haben einen Talk-to-Slack GPT auf OpenAI erstellt. Die Talk-to-Slack-Webanwendung ist sehr ähnlich.

Talk-to-Slack.com-Webanwendung von Rememberizer auf Heroku
Talk to Slack GPT von Rememberizer auf OpenAI

Einleitung

In diesem Leitfaden bieten wir schrittweise Anweisungen und den vollständigen Quellcode an, um Ihnen zu helfen, Ihre eigene Anwendung zu erstellen, die unserer Talk-To-Slack GPT-Integration mit Rememberizer.ai ähnelt. Im Gegensatz zur Slack-Integration bietet eine Web-App mehr Funktionen und Kontrolle, wie zum Beispiel Web-Scraping, Zugriff auf lokale Datenbanken, Grafiken und Animationen und das Sammeln von Zahlungen. Außerdem kann es von jedem ohne die Notwendigkeit eines Premium genAI-Kontos verwendet werden.

Übersicht

Unsere Beispielanwendung, Talk to Slack, wird auf Heroku gehostet und integriert OpenAI's LLM mit Rememberizer.ai, um Ihre Slack-Erfahrung zu verbessern. Die Web-App ist mit Flask erstellt und bietet Funktionen wie OAuth2-Integration, Zugriff auf Slack-Daten und eine intuitive Benutzeroberfläche.

Eigenschaften

  • Flask-basierte Architektur: Backend-Operationen, Frontend-Kommunikationen und API-Interaktionen werden durch Flask gehandhabt.

  • OAuth2-Integration: Sichere Autorisierung und Datenzugriff mit dem Rememberizer's OAuth2-Fluss.

  • Slack Datenzugriff: Ruft die verbundenen Slack-Daten des Benutzers sicher ab, indem Rememberizer's APIs verwendet werden.

  • OpenAI LLM Integration: Verarbeitet Anfragen mit OpenAI's LLM-Service für aufschlussreiche Antworten.

  • Intuitive Benutzeroberfläche: Einfache Navigation und Interaktion mit einem modernen UI-Design.

  • Best Practices: Hält sich an Sicherheits- und Benutzererfahrungsstandards für eine nahtlose Integration.

Einrichtung und Bereitstellung

Voraussetzungen

  • Python

  • Flask

Bitte beachten Sie, dass es nicht sehr schwierig war, ein LLM diese gesamte Anwendung in eine andere Sprache, in unserem Fall Golang, umschreiben zu lassen. Denken Sie also daran, dass Sie nicht auf Python beschränkt sind.

Umgebungskonfiguration

Setzen Sie diese Umgebungsvariablen:

  • APP_SECRET_KEY: Eindeutiger geheimer Schlüssel für Flask.

  • REMEMBERIZER_CLIENT_ID: Client-ID für Ihre Rememberizer-App.

  • REMEMBERIZER_CLIENT_SECRET: Client-Geheimnis für Ihre Rememberizer-App.

  • OPENAI_API_KEY: Ihr OpenAI-API-Schlüssel.

Anwendung Ausführen

  1. Flask-App starten: Führen Sie flask run im Terminal aus und greifen Sie auf die App unter http://localhost:5000 zu.

  2. Kopieren Sie die Callback-URL in Ihre Rememberizer-App-Konfiguration: https://<YOURHOST>/auth/rememberizer/callback Beispiel: http://localhost:5000/auth/rememberizer/callback.

Bereitstellung in der Cloud

Die Bereitstellung auf Plattformen wie Heroku, Google Cloud Platform (GCP), Amazon Web Services (AWS) oder Microsoft Azure wird empfohlen.

Heroku-Bereitstellung

  1. Erstellen Sie ein Heroku-Konto: Installieren Sie die Heroku CLI.

  2. Bereiten Sie Ihre Anwendung vor: Stellen Sie sicher, dass ein Procfile, runtime.txt und requirements.txt vorhanden sind.

  3. Bereitstellen: Verwenden Sie die Heroku CLI oder die GitHub-Integration für die Bereitstellung.

Detaillierte Schritte

  • Verbinden Sie Heroku mit GitHub: Aktivieren Sie automatische Bereitstellungen aus dem GitHub-Repository für nahtlose Updates.

  • Manuelle Bereitstellung: Optional können Sie die manuelle Bereitstellung für mehr Kontrolle verwenden.

Zusätzliche Einrichtung

  • Installieren Sie die Heroku CLI: brew tap heroku/brew && brew install heroku (macOS).

  • Fügen Sie SSL-Zertifikate hinzu: Verwenden Sie selbstsignierte Zertifikate für die anfängliche HTTPS-Einrichtung.

  • Konfigurieren Sie Umgebungsvariablen auf Heroku: Verwenden Sie heroku config:set KEY=value für wichtige Schlüssel.

Andere Cloud-Plattformen

  • GCP: Richten Sie ein GCP-Konto ein, bereiten Sie Ihre App mit app.yaml vor und stellen Sie mit gcloud app deploy bereit.

  • AWS: Verwenden Sie Elastic Beanstalk für die Bereitstellung, nachdem Sie ein AWS-Konto und die AWS CLI eingerichtet haben.

  • Azure: Stellen Sie über Azure App Service bereit, nachdem Sie ein Azure-Konto erstellt und die Azure CLI installiert haben.

Sicherheit und bewährte Praktiken

Überprüfen Sie vor der Bereitstellung Ihre requirements.txt, passen Sie die Konfigurationen für die Produktion an und aktualisieren Sie die OAuth-Redirect-URIs.

Anwendungs-Code Hinweise

@app.route('/') (Index-Route):

Diese Route rendert die index.html-Vorlage, wenn die Stamm-URL (/) aufgerufen wird. Sie dient als Startseite Ihrer Anwendung.

@app.route('/auth/rememberizer') (Rememberizer-Authentifizierungsroute):

Diese Route initiiert den OAuth2-Authentifizierungsprozess mit Rememberizer.ai. Sie generiert einen zufälligen Statuswert, speichert ihn in der Sitzung, konstruiert die Autorisierungs-URL mit den notwendigen Parametern (Client-ID, Umleitungs-URI, Scope und Status) und leitet den Benutzer zur Autorisierungsseite von Rememberizer.ai weiter.

@app.route('/auth/rememberizer/callback') (Rememberizer-Callback-Route):

Diese Route verarbeitet den Callback von Rememberizer.ai, nachdem der Benutzer Ihre Anwendung autorisiert hat. Sie extrahiert den Autorisierungscode aus den Abfrageparametern, tauscht ihn gegen ein Zugriffstoken an Rememberizer.ai's Token-Endpunkt und speichert das Zugriffstoken in der Sitzung. Anschließend leitet sie den Benutzer zur /dashboard-Route weiter.

@app.route('/dashboard') (Dashboard-Route):

Diese Route zeigt dem Benutzer die Dashboard-Seite an. Sie überprüft, ob der Benutzer ein Zugriffstoken in der Sitzung hat; wenn nicht, leitet sie ihn zur Authentifizierungsroute weiter. Wenn der Benutzer authentifiziert ist, wird eine Anfrage an Rememberizer.ai's Konto-Endpunkt gesendet, um Kontoinformationen abzurufen, und die dashboard.html-Vorlage wird mit diesen Informationen gerendert.

@app.route('/slack-info') (Slack-Integrationsinfo-Route):

Diese Route zeigt Informationen über die Slack-Integration des Benutzers mit Rememberizer.ai an. Sie überprüft auf ein Zugriffstoken und sendet eine Anfrage an Rememberizer.ai's Integrationen-Endpunkt, um die Integrationsdaten zu erhalten. Anschließend rendert sie die slack_info.html-Vorlage mit diesen Daten.

@app.route('/ask', methods=['POST']) (Frage-Route):

Diese Route verarbeitet die Einreichung von Fragen des Benutzers. Sie überprüft auf ein Zugriffstoken, ruft die Frage des Benutzers aus den Formulardaten ab und sendet eine Anfrage an Rememberizer.ai's Dokumentensuche-Endpunkt, um relevante Informationen zu finden. Anschließend verwendet sie das GPT-4-Modell von OpenAI, um eine Antwort basierend auf der Frage und den Suchergebnissen zu generieren. Die Antwort wird in der answer.html-Vorlage gerendert.

Zusätzliche Anmerkungen

  • Ikonografie: Gestaltet im Stil detailreicher Papierfaltkunst, die die Integration von KI und Kommunikation widerspiegelt. Unser Symbol wurde in Midjourney und Image2Icon erstellt.

  • SSL-Konfiguration: Generieren Sie selbst signierte Zertifikate mit OpenSSL für eine sichere Kommunikation.

Erkunden und Innovieren

Wir ermutigen zur Erkundung und Innovation mit Ihrer eigenen KI-integrierten Webanwendung, die darauf abzielt, die Produktivität und Zusammenarbeit innerhalb Ihrer Plattform zu verbessern.


Diese überarbeitete Dokumentation bietet eine umfassende Anleitung für Entwickler, um ihre eigene KI-integrierte Webanwendung zu erstellen, ähnlich wie Talk-to-Slack. Sie enthält detaillierte Anweisungen zur Einrichtung, Bereitstellung und Übersicht über den Anwendungscode sowie Best

Last updated