ブラウザで音声制御されたAIチャットインターフェイスを提供します。 AIアシスタントは、Spotify、Googleカレンダー、Googleマップなどのさまざまなサービスと統合するツールを使用できます。
このプロジェクトの大まかなアイデアは、Amazon AlexaやSiriに似た音声起動アシスタントを持つことですが、大規模な言語モデルに裏付けられています。現在、ブラウザで純粋に実行されているWebサイトとして実装されています。デフォルトでは、いくつかのツール(「関数」)で構成されたOpenAIのGPT-4Oモデルを使用して、さまざまなAPIと統合できます。これらのAPIを使用するには、秘密を提供する必要があります。以下を参照してください。最も「洗練された」統合は、GoogleとSpotify用です。
一般的に、あなたはそれがあなたのために何ができるかをアシスタントに尋ねることができます。 ;-)
packages/frontend/srcディレクトリにconfig.tsという名前のファイルを作成します。ファイルpackages/frontend/src/config.ts.exampleをコピーして、ニーズに合わせて調整できます。
// The following configuration is required:
// By configuring the endpoints below, you can use a server with OpenAI compatible REST API:
export const completionsApiKey = "<The API Key used for /completions endpoint>" ;
export const completionsApiUrl = "https://api.openai.com/v1" ;
export const modelName = "gpt-4o" ;
export const useTools = true ;
export const speechApiKey = "<The API Key used for the TTS endpoint>" ;
export const speechApiUrl = "https://api.openai.com/v1" ;
export const transcriptionApiKey = "<The API Key used for the SST endpoint>" ;
export const transcriptionApiUrl = "https://api.openai.com/v1" ;
export const transcriptionModel = "whisper-1" ;
// All the following API keys are optional, and are only required if you want to use the corresponding features.
// Your picovoice.ai Access Key (wake word detection):
export const PicoVoiceAccessKey = "" ;
// Your openweathermap.org API Key (used for weather tools):
export const OpenWeatherMapApiKey = "" ;
// Your newsapi.org API key (used for some news tools):
export const NewsApiOrgKey = "" ;
export const GoogleApiKey = "<Your googleapis.com API key>" ;
export const GoogleClientId = "XXX.apps.googleusercontent.com" ;
export const GoogleClientSecret = "<Your OAuth2 Client Secret/Key>" ;
export const GoogleCustomSearchEngineId = "<ID of your custom google search engine configured for global search>" ;
// export const GoogleProjectId = "<Your Google Cloud Console project ID>"; // Needed for Google Vertex AI API (Gemini Pro)
export const SpotifyClientId = "<Your Spotify Client ID>" ;
export const MicrosoftClientId = "<Your Azure App Client ID>" ;このファイルはGitによって無視されます。
注:現在、コードにインポートされ、フォールバックとして使用されるため、上記の構成を現在提供する必要があります。ただし、アシスタント設定UIから、任意の数のモデルとLLMプロバイダーを構成してそれらを切り替えることができます。
GPT-4モデルのいずれかを使用するには、Platform.openai.comアカウントには請求情報と1つの成功した支払いが必要です。アカウントが請求されなかった場合は、請求概要ページで「クレジットを購入」して手動で支払いを開始できます。これにより、GPT-4モデルの「ロックを解除」します。
OpenWeatherMap.orgのAPIキーは、無料層用です。
同様に、Picovoice.aiのAPIキーは、個人的な使用のために自由に入手できます。レート制限が付いています。 PicovoiceAccessKeyを提供しないと、ウェイクワード検出が破損する可能性が高いです。理論的には、ブラウザの音声認識APIはフォールバックとして使用されますが、しばらくテストされていません。
Google APIのAPIキーを取得するには、Google開発者コンソールで「プロジェクト」を作成し、次のAPIを有効にする必要があります。
オプションのGoogleカレンダーと連絡先統合(Switch Google Integrationを介してアシスタント設定で有効になっている)の場合、 GoogleApiKeyに加えてGoogleClientId提供する必要があります。その理由は、Googleアカウントでログインする必要があるため、これにはプロジェクトのGoogle CloudコンソールでタイプWeb ApplicationのOAUTH2クライアントをセットアップする必要があります。
クラウドプロジェクトで多くのことを構成する必要があります。
OAuth 2.0-Client-IDを作成します。http://localhost:5173とhttp://localhost両方を承認されたJavaScriptオリジンに追加します。http://localhost:5173/google-callback承認されたリダイレクトURIに追加します。OAuth Consent Screenを編集します。http://localhost:5173に設定します(これが実際に必要かどうかはわかりません。)https://www.googleapis.com/auth/calendarhttps://www.googleapis.com/auth/contacts.readonlyhttps://www.googleapis.com/auth/photoslibrary.readonlyオプションのSpotify統合(Switch Spotify Integrationを介してアシスタント設定で有効になっている)の場合、 SpotifyClientIdを提供する必要があります。クライアントIDを取得するには、Spotify開発者ダッシュボードにアプリケーションを登録する必要があります。
Webサイトとして、 http://localhost:5173を指定します。 URLをリダイレクトすると、 http://localhost:5173/spotify-callbackを指定します。
Spotifyの統合を有効にすると、Spotifyログインページにリダイレクトされ、音声アシスタント(またはSpotify開発者ダッシュボードでアプリを指定)に要求された権限を提供する必要があります。さらに、Web再生SDKにはプレミアムアカウントが必要なため、組み込みの再生ストリーミング機能はSpotifyプレミアムユーザーにのみ機能します。
オプションのMicrosoft統合(Switch Microsoft Integrationを介してアシスタント設定で有効)の場合、 MicrosoftClientId提供する必要があります。クライアントIDを取得するには、Azureポータルにアプリケーションを登録する必要があります。次の設定が必要です。
Single Page Applicationなければなりません。http://localhost:5173/microsoft-callbackでなければなりません。User.ReadとCalendars.ReadWriteを含める必要があります。OpenAI互換性のあるレストエンドポイントを提供するサービスがたくさんあります。たとえば、さまざまなLLMをローカルで実行できるプロジェクトであるLocalaiがあります。しかし、LM Studio、VLLMなどのような他の人もいます。
これらのプロジェクトは、OpenAIのドロップイン代替として(ほとんど)使用できるAPIを提供します。
このため、 config.tsファイルは、APIキーやモデル名のようにcompletionsApiUrlと関連する設定をエクスポートします。これにより、別のOpenAI互換サーバーを構成できます。 Mistral、Groqなどをテストしました。ただし、ツールのサポートは現在、GPT-4ターボができることと比較して非常に限られています。多くの場合、ストリーミングとツールを同時に使用することはできません。そして、LLMはしばしば吹き飛ばされており、ツールを使用するタイミングとそれらを呼び出す方法を確実に理解していません。 OpenaiのGPT-4-Turboを使用すると、完璧な信頼性に近い30以上を使用できます。
packages/frontend/src/config.tsファイルを準備した後、実行できます。
yarn install
yarn workspace voice-assistant-frontend devconfig.tsからすべてのキーを公開するため、どこかで公開してください。