Talk-to-Slack サンプルウェブアプリ¶

アプリのソースコードはこちらにあります。

このセクションでは、ステップバイステップの指示と完全なソースコードを提供し、あなたが自分のアプリケーションを迅速に作成できるようにします。

私たちはOpenAIでTalk-to-Slack GPTを作成しました。Talk-to-Slackウェブアプリは非常に似ています。

総論¶

このガイドでは、ステップバイステップの手順と全ソースコードを提供し、あなたが私たちのTalk-to-Slack GPT連携と同様のアプリケーションを独自に作成するのを支援します。Rememberizer.aiとの連携とは異なり、ウェブアプリはウェブスクレイピング、ローカルデータベースへのアクセス、グラフィックとアニメーション、支払いの収集など、より多くの機能と制御を提供します。プラス、プレミアムgenAIアカウントがなくても誰でも使用できます。

概要¶

私たちの示例アプリケーションである「Talk to Slack」はHeroku上にホストされ、OpenAIのLLMとRememberizer.aiを統合してあなたのSlack体験を向上させます。このウェブアプリはFlaskを用いて構築されており、OAuth2の統合、Slackデータのアクセス、直感的なユーザーインターフェースなどの機能を提供しています。

機能¶

Flaskベースのアーキテクチャ: バックエンドの操作、フロントエンドの通信、APIとの接続はFlaskによって処理されます。
OAuth2統合: RememberizerのOAuth2フローによる安全な認証とデータアクセス。
Slackデータアクセス: RememberizerのAPIを使用して、ユーザーが接続したSlackのデータを安全に取得します。
OpenAI LLM統合: OpenAIのLLMサービスを用いてクエリを処理し、洞察に満ちたレスポンスを得られます。
直感的なユーザーインターフェイス: モダンなUIデザインによる簡単なナビゲーションと対話。
ベストプラクティス: シームレスな統合のためのセキュリティとユーザーエクスペリエンスの標準に準拠しています。

セットアップとデプロイメント¶

前提条件¶

Python
Flask

Info

このアプリケーション全体を別の言語、私たちの場合はGolangで書き換えるのはそれほど難しくありませんでした。したがって、Pythonに限定されているわけではないことを念頭に置いてください。

環境設定¶

以下の環境変数を設定します：

APP_SECRET_KEY：Flask用のユニークな秘密鍵。
REMEMBERIZER_CLIENT_ID：あなたのRememberizerアプリのクライアントID。
REMEMBERIZER_CLIENT_SECRET：あなたのRememberizerアプリのクライアントシークレット。
OPENAI_API_KEY：あなたのOpenAI APIキー。

アプリケーションの実行¶

Flaskアプリを起動: ターミナルで flask run を実行し、アプリに http://localhost:5000 でアクセスします。
コールバックURLをRememberizerアプリの設定にコピー: https://<YOURHOST>/auth/rememberizer/callback 例: http://localhost:5000/auth/rememberizer/callback。

クラウドへのデプロイ¶

Heroku、Google Cloud Platform (GCP)、Amazon Web Services (AWS)、またはMicrosoft Azureなどのプラットフォームへのデプロイを推奨します。

Herokuデプロイ

Herokuアカウントを作成: Heroku CLIをインストールします。
アプリケーションを準備: Procfile、runtime.txt、およびrequirements.txtが存在することを確認します。
デプロイ: Heroku CLIまたはGitHub統合を使用してデプロイします。

詳細な手順

HerokuをGitHubに接続: シームレスな更新のためにGitHubリポジトリからの自動デプロイを有効にします。
手動でデプロイ: より多くの制御が必要な場合は、手動デプロイを使用します。

追加設定

Heroku CLIをインストール: brew tap heroku/brew && brew install heroku（macOS）。
SSL証明書を追加: 初期HTTPS設定のために自己署名証明書を使用します。
Herokuの環境変数を設定: 重要なキーのためにheroku config:set KEY=valueを使用します。

他のクラウドプラットフォーム

GCP: GCPアカウントを設定し、app.yamlでアプリを準備し、gcloud app deployを使用してデプロイします。
AWS: AWSアカウントとAWS CLIを設定した後、Elastic Beanstalkを使用してデプロイします。
Azure: Azureアカウントを作成し、Azure CLIをインストールした後、Azure App Serviceを通じてデプロイします。

セキュリティとベストプラクティス¶

デプロイ前に、requirements.txtを確認し、プロダクション用に設定を調整し、OAuthリダイレクトURIを更新してください。

アプリケーションコードノート¶

@app.route('/') (インデックスルート):

このルートは、ルートURL（/）にアクセスされたときにindex.htmlテンプレートをレンダリングします。アプリケーションのホームページとして機能します。

@app.route('/auth/rememberizer') (Rememberizer認証ルート):

このルートは、Rememberizer.aiとのOAuth2認証プロセスを開始します。ランダムな状態値を生成し、それをセッションに保存し、必要なパラメータ（クライアントID、リダイレクトURI、スコープ、および状態）を使用して認証URLを構築し、ユーザーをRememberizer.aiの認証ページにリダイレクトします。

@app.route('/auth/rememberizer/callback') (Rememberizerコールバックルート):

このルートは、ユーザーがアプリケーションを認証した後のRememberizer.aiからのコールバックを処理します。クエリパラメータから認証コードを抽出し、Rememberizer.aiのトークンエンドポイントを使用してアクセストークンと交換し、アクセストークンをセッションに保存します。その後、ユーザーを/dashboardルートにリダイレクトします。

@app.route('/dashboard') (ダッシュボードルート):

このルートは、ユーザーにダッシュボードページを表示します。セッションにアクセストークンがあるかどうかを確認し、ない場合は認証ルートにリダイレクトします。ユーザーが認証されている場合、Rememberizer.aiのアカウントエンドポイントにリクエストを行い、アカウント情報を取得し、この情報でdashboard.htmlテンプレートをレンダリングします。

@app.route('/slack-info') (Slack統合情報ルート):

このルートは、ユーザーのRememberizer.aiとのSlack統合に関する情報を表示します。アクセストークンを確認し、Rememberizer.aiの統合エンドポイントにリクエストを行い、統合データを取得します。その後、このデータでslack_info.htmlテンプレートをレンダリングします。

@app.route('/ask', methods=['POST']) (質問ルート):

このルートは、ユーザーからの質問の送信を処理します。アクセストークンを確認し、フォームデータからユーザーの質問を取得し、Rememberizer.aiのドキュメント検索エンドポイントにリクエストを行い、関連情報を見つけます。その後、OpenAIのGPT-4モデルを使用して、質問と検索結果に基づいて回答を生成します。回答はanswer.htmlテンプレートにレンダリングされます。

追加の注記¶

アイコン制作: AIとコミュニケーションの統合を反映した、詳細な折り紙アートスタイルでデザインされました。私たちのアイコンはMidjourneyとImage2Iconで作成されました。
SSL設定: OpenSSLを使用して自己署名証明書を生成し、安全な通信を行います。

探索と革新¶

自分自身のAI統合ウェブアプリを使って探索と革新を奨励し、プラットフォーム内での生産性とコラボレーションを向上させることを目指します。

この改訂されたドキュメントは、開発者がTalk-to-Slackに似た自分自身のAI統合ウェブアプリを作成するための包括的なガイドを提供します。セットアップ、デプロイメント、およびアプリケーションコードの概要に関する詳細な指示が含まれており、ベスト