Talk-to-Slack l'App Web di Esempio

È molto facile creare una semplice applicazione web che integrerà un LLM con la conoscenza dell'utente attraverso query a Rememberizer.

Il codice sorgente dell'app può essere trovato qui.

In questa sezione forniremo istruzioni passo dopo passo e il codice sorgente completo in modo che tu possa rapidamente creare la tua applicazione.

Abbiamo creato un Talk-to-Slack GPT su OpenAI. L'applicazione web Talk-to-Slack è molto simile.


Introduzione

In questa guida, forniamo istruzioni passo-passo e il codice sorgente completo per aiutarti a creare la tua applicazione simile alla nostra integrazione Talk-to-Slack GPT con Rememberizer.ai. A differenza dell'integrazione Slack, un'app web offre più funzionalità e controllo, come lo scraping web, l'accesso al database locale, la grafica e l'animazione, e la raccolta dei pagamenti. Inoltre, può essere utilizzata da chiunque senza la necessità di un account genAI premium.

Panoramica

La nostra applicazione di esempio, Talk to Slack, è ospitata su Heroku e integra LLM di OpenAI con Rememberizer.ai per migliorare la tua esperienza su Slack. L'app web è costruita utilizzando Flask e offre funzionalità come l'integrazione OAuth2, l'accesso ai dati di Slack e un'interfaccia utente intuitiva.

Funzionalità

  • Architettura basata su Flask: Le operazioni del backend, le comunicazioni del frontend e le interazioni API sono gestite da Flask.

  • Integrazione OAuth2: Autorizzazione sicura e accesso ai dati con il flusso OAuth2 di Rememberizer.

  • Accesso ai dati di Slack: Recupera i dati di Slack connessi dell'utente in modo sicuro utilizzando le API di Rememberizer.

  • Integrazione OpenAI LLM: Elabora le query con il servizio LLM di OpenAI per risposte perspicaci.

  • Interfaccia Utente Intuitiva: Facile navigazione e interazione con un moderno design dell'interfaccia utente.

  • Migliori pratiche: Rispetta gli standard di sicurezza e di esperienza utente per un'integrazione senza problemi.

Configurazione e Implementazione

Prerequisiti

  • Python

  • Flask

[Nota che non è stato molto difficile avere un LLM che riscrivesse l'intera applicazione in un altro linguaggio, nel nostro caso Golang. Quindi tieni presente che non sei limitato a Python]

Configurazione dell'Ambiente

Imposta queste variabili di ambiente:

  • APP_SECRET_KEY: Chiave segreta unica per Flask.

  • REMEMBERIZER_CLIENT_ID: ID del client per la tua app Rememberizer.

  • REMEMBERIZER_CLIENT_SECRET: Segreto del client per la tua app Rememberizer.

  • OPENAI_API_KEY: La tua chiave API di OpenAI.

Esecuzione dell'applicazione

  1. Avvia l'App Flask: Esegui flask run nel terminale e accedi all'app su http://localhost:5000.

[Per test e sviluppo]

Distribuzione nel Cloud

Si consiglia la distribuzione su piattaforme come Heroku, Google Cloud Platform (GCP), Amazon Web Services (AWS) o Microsoft Azure.

Distribuzione con Heroku

  1. Crea un Account Heroku: Installa la CLI di Heroku.

  2. Prepara la tua Applicazione: Assicurati che siano presenti un Procfile, un runtime.txt e un requirements.txt.

  3. Distribuisci: Usa la CLI di Heroku o l'integrazione con GitHub per la distribuzione.

Passaggi Dettagliati

  • Collega Heroku a GitHub: Abilita i deploy automatici dal repository di GitHub per aggiornamenti senza interruzioni.

  • Distribuisci Manualmente: Opzionalmente, utilizza la distribuzione manuale per avere più controllo.

Setup Aggiuntivo

  • Installa la CLI di Heroku: brew tap heroku/brew && brew install heroku (macOS).

  • Aggiungi certificati SSL: Usa certificati autofirmati per l'installazione iniziale di HTTPS.

    • Un certificato ufficiale a pagamento è sicuramente la scelta migliore in produzione, ma per testare rapidamente e a basso costo, puoi farlo gratuitamente.

  • Configura le Variabili d'Ambiente su Heroku: Utilizza heroku config:set KEY=value per le chiavi essenziali.

Altre Piattaforme Cloud

  • GCP: Crea un account GCP, prepara la tua app con app.yaml e distribuisci utilizzando gcloud app deploy.

  • AWS: Usa Elastic Beanstalk per la distribuzione dopo aver impostato un account AWS e la CLI di AWS.

  • Azure: Distribuisci tramite Azure App Service dopo aver creato un account Azure e installato la CLI di Azure.

Sicurezza e Migliori Pratiche

Prima del deployment, verifica i tuoi requirements.txt, regola le configurazioni per la produzione e aggiorna gli URI di reindirizzamento OAuth.

requirements.txt

Flask==3.0.2
requests==2.31.0
gunicorn==21.2.0
openai==1.14.0
pytest==8.1.1

Panoramica del codice dell'applicazione

Ecco una breve panoramica delle principali rotte nell'applicazione:

  • @app.route('/') (Rotta dell'indice): Restituisce la homepage dell'applicazione.

  • @app.route('/auth/rememberizer') (Rotta di autenticazione Rememberizer): Avvia il processo di autenticazione OAuth2 con Rememberizer.ai.

  • @app.route('/auth/rememberizer/callback') (Rotta di callback Rememberizer): Gestisce il callback da Rememberizer.ai dopo l'autorizzazione dell'utente.

  • @app.route('/dashboard') (Rotta del cruscotto): Mostra la pagina del cruscotto all'utente.

  • @app.route('/slack-info') (Rotta delle informazioni sull'integrazione Slack): Mostra informazioni sull'integrazione Slack dell'utente con Rememberizer.ai.

  • @app.route('/ask', methods=['POST']) (Rotta Chiedi): Gestisce l'invio di domande da parte dell'utente e genera una risposta utilizzando il modello GPT-4 di OpenAI.

Note aggiuntive

  • Iconografia: Progettata con uno stile artistico dettagliato di carta piegata, che riflette l'integrazione di AI e comunicazione. La nostra icona è stata creata in Midjourney e Image2Icon.

  • Configurazione SSL: Genera certificati auto-firmati utilizzando OpenSSL per una comunicazione sicura.

Esplora e Innovare

Incoraggiamo l'esplorazione e l'innovazione con la tua propria web app integrata con AI, con l'obiettivo di migliorare la produttività e la collaborazione all'interno della tua piattaforma.


Questa documentazione rivista fornisce una guida completa per gli sviluppatori per creare la propria web app integrata con AI, simile a Talk-to-Slack. Include istruzioni dettagliate per l'installazione, il dispiegamento e la panoramica del codice dell'applicazione, insieme alle migliori

Last updated