Open WebUI と CData Connect AI を連携してリアルタイムの BigCommerce データと対話する
Open WebUI は、ホスト型の LLM API とローカルで提供されるモデルを、カスタマイズ可能な単一のインターフェースにまとめたオープンソースのセルフホスト型 AI チャットプラットフォームです。ツールサーバーフレームワークを通じて Model Context Protocol(MCP) をサポートしており、外部ツールやデータソースを設定することで、チャットがモデルの学習データの枠を超えてリアルタイムのシステムとやり取りできるようになります。
組み込みの MCP Server を介して Open WebUI を CData Connect AI と連携させると、Open WebUI はガバナンスの効いた状態でリアルタイムの BigCommerce のデータ にアクセスできるようになります。これにより、自然言語のプロンプトを使ってカタログの一覧表示、スキーマの探索、BigCommerce のデータ のレコードへのクエリが可能になり、すべてのデータアクセスは認可されたデータソースに対して安全に実行されます。
この記事では、Connect AI で BigCommerce への接続を設定し、必要な Personal Access Token を生成して、Open WebUI をインストールし、Connect AI MCP Server を登録、LLM プロバイダーを設定したうえで、Open WebUI のチャットインターフェースからリアルタイムの BigCommerce のデータ にクエリを実行して連携を確認するまでの手順を説明します。
Step 1: Open WebUI 向けに BigCommerce への接続を設定
Open WebUI から BigCommerce への接続は、Connect AI の Remote MCP Server を介して実現します。Open WebUI から BigCommerce のデータ と対話するには、まず Connect AI で BigCommerce 接続を作成・設定していきましょう。
- Connect AI にログインし、Sources をクリックして、 Add Connection をクリックします
- Add Connection パネルから BigCommerce を選択します
-
BigCommerce に接続するために必要な認証プロパティを入力します。
BigCommerce 認証は標準のOAuth フローに基づいています。
Store ID の取得
BigCommerce Store に接続するには、StoreId が必要です。Store Id を確認するには、以下の手順に従ってください。
- BigCommerce アカウントにログインします。
- ホームページから「Advanced Settings」->「API Accounts」 を選択します。
- 「Create API Account」->「Create V2/V3 API Token」をクリックします。
- 画面にAPI Path という名前のテキストボックスが表示されます。
- テキストボックス内に、次の構造のURL が表示されます:https://api.bigcommerce.com/stores/{Store Id}/v3。
- 上記で示したように、Store Id は'stores/' と'/v3' パスパラメータの間にあります。
- Store Id を取得したら、「キャンセル」 をクリックするか、まだ持っていない場合はAPI Account の作成に進むことができます。
パーソナルアクセストークンの取得
加えて、自分のデータをテストおよびアクセスするには、個人用トークンを取得する必要があります。個人用トークンを取得する方法は次のとおりです。
- BigCommerce アカウントにログインします。
- ホームページから「Advanced Settings」->「API Accounts」 を選択します。
- 「Create API Account」->「Create V2/V3 API Token」をクリックします。
- アカウント名を入力します。
- 作成するAPI Account の「OAuth Scopes」を選択します。CData 製品 は"None" とマークされたデータにアクセスできません。また、"read-only" とマークされたデータを変更できません。
- 「保存」をクリックします。
BigCommerce への認証
次に、以下を設定してデータに接続できます。- StoreId:API Path テキストボックスから取得したStore ID に設定。
- OAuthAccessToken:生成したトークンに設定。
- InitiateOAuth:OFF に設定。
- Save & Test をクリックします
- Permissions タブに移動し、ユーザーベースの権限を更新します
Personal Access Token を追加する
Personal Access Token(PAT)は、Open WebUI から Connect AI への接続を認証するために使用します。きめ細かなアクセス制御を維持するために、連携ごとに個別の PAT を作成することをおすすめします。
- Connect AI アプリの右上にある歯車アイコン()をクリックして Settings を開きます
- Settings ページで Access Tokens セクションに移動し、 Create PAT をクリックします
- PAT にわかりやすい名前を付けて Create をクリックします
- トークンが表示されたらコピーして安全な場所に保存してください。再度表示されることはありません
BigCommerce 接続を設定し、PAT を生成すれば、Open WebUI から Connect AI を介して BigCommerce のデータ に接続できるようになります。
Step 2: Open WebUI をインストールして Connect AI MCP を設定
次に、Open WebUI をローカルにインストールし、Connect AI Remote MCP Server をツールサーバーとして設定していきましょう。これにより、チャットインターフェースが Connect AI を通じてリアルタイムデータ向けのツールを検出・呼び出せるようになります。
- 公式の クイックスタートガイドに従って Open WebUI をインストールします
- インストールが完了したら、Open WebUI を起動してブラウザーで開き、チャットインターフェースにアクセスします
-
右上のプロフィールアイコンをクリックし、Admin Panel を選択します
-
Admin Panel の上部ナビゲーションバーで Settings をクリックします
-
左メニューから Integrations を選択し、Manage Tool Servers の横にある アイコンをクリックして新しい接続を追加します
-
Add Connection パネルで、次の値を使ってサーバーを設定します。
- Type: MCP Streamable HTTP
- Name: CData MCP、または任意の名前
- ID: cdata-mcp
- URL: https://mcp.cloud.cdata.com/mcp
- Auth: None
-
Advanced セクションを展開し、次の JSON を Headers フィールドに貼り付けます。
{ "Authorization": "Basic your_base64_encoded_email_PAT", "Content-Type": "application/json" }注意:Open WebUI は Connect AI との通信に Basic authentication を使用します。Connect AI のユーザーメールアドレスと、先ほど作成した PAT を email:PAT の形式で結合し、その文字列を Base64 エンコードして、先頭に Basic を付けます。たとえば [email protected]:ABC123...XYZ789 の場合、Authorization ヘッダーの値は次のようになります:Basic dXNlckBkb21haW4uY29tOkFCQzEyMy4uLlhZWjc4OQ==
- Save をクリックしてツールサーバーを登録します
MCP サーバーを有効化して LLM プロバイダーを設定する
Open WebUI でチャットを動かすには、少なくとも 1 つの LLM プロバイダーが必要です。チャット入力欄から MCP サーバーを有効化し、お好みのプロバイダーの API キーを設定しましょう。これにより、モデルがプロンプトを解釈し、Connect AI を介して MCP ツールを呼び出せるようになります。
-
チャットインターフェースに戻り、チャット入力欄の下部にある Integrations アイコンをクリックして Tools を選択し、CData MCP をオンに切り替えてツールをチャットに公開します
- チャット上部のモデルセレクターをクリックし、お好みの LLM プロバイダーとモデルを選択します。プロンプトが表示されたらプロバイダーの API キーを追加し、チャットでモデルを使用できるようにします
MCP サーバーと LLM プロバイダーの設定が完了すれば、Open WebUI から Connect AI を介してリアルタイムの BigCommerce のデータ にクエリを実行する準備が整います。
Step 3: Open WebUI からリアルタイムの BigCommerce のデータ にクエリ
連携が完了したら、Open WebUI のチャット入力欄を使い、設定した LLM が処理する自然言語のプロンプトでリアルタイムの BigCommerce のデータ と対話してみましょう。
-
CData MCP サーバーを有効化してモデルを選択した状態で、チャット入力欄にプロンプトを入力します。たとえば次のようなプロンプトです。
- cdata mcp 内のすべてのカタログを一覧表示して
- BigCommerce の利用可能なスキーマとテーブルを表示して
- BigCommerce のデータ のテーブルから上位 5 件のレコードを取得して
-
Open WebUI が Connect AI MCP Server を呼び出し、BigCommerce のデータ からリアルタイムの結果を返します
これで、Open WebUI インスタンスが Connect AI MCP Server と通信し、リモート MCP ツールを通じてチャットインターフェースから直接 BigCommerce のデータ のリアルタイムデータを取得できるようになりました。
CData Connect AI の入手
数百種類の SaaS、ビッグデータ、NoSQL データソースにクラウドアプリケーションから直接アクセスするには、ぜひ CData Connect AI をお試しください。 14日間の無償トライアルを今すぐダウンロードしてみましょう。ご不明な点があれば、いつでも世界トップクラスのサポートチームがお手伝いします。