Axios と CData Connect AI で WordPress に接続した Web アプリを構築

Jerod Johnson
Jerod Johnson
Senior Technology Evangelist
CData Connect AI を使用してライブWordPress のデータに接続し、Axios で WordPress に接続した Web アプリを構築します。

Axios は開発者が Web ブラウザや Node.js からサーバーに HTTP リクエストを送信できる JavaScript ライブラリです。CData Connect AI と組み合わせることで、Web アプリからライブWordPress のデータにアクセスできます。この記事では、WordPress に接続し、Axios でライブWordPress のデータにアクセスできる Web アプリを構築する方法を説明します。

Axios から WordPress に接続

Axios で WordPress を操作するには、Connect AI から WordPress に接続し、ユーザーにアクセス権を提供し、WordPress のデータ 用のワークスペースを作成する必要があります。

Connect AI から WordPress に接続

CData Connect AI はシンプルなポイントアンドクリックインターフェースでデータソースに接続できます。

  1. Connect AI にログインして「Sources」をクリック、次に「 Add Connection」をクリック
  2. 接続を追加パネルから「WordPress」を選択
  3. WordPress に接続するために必要な認証プロパティを入力します。

    WordPress 接続プロパティの取得・設定方法

    現時点では、CData JDBC Driver for WordPress はセルフホスト型のWordPress インスタンスへの接続のみをサポートしています。データに接続するには、Url を自身のwordpress サイトに指定し、次に以下に説明するように認証を行います。

    URL を完全な形式で記入します。例えば、あなたのサイトが'http://localhost/wp/wordpress' でホストされている場合、URL は'http://localhost' ではなく、'http://localhost/wp/wordpress' となるべきです。 URL を完全な形式で入力しないと、'site not found' というエラーが発生します。

    WordPress は2種類の認証をサポートします。

    • Basic 認証は、テスト環境での使用が推奨されます。
    • OAuth 2.0 認証は、デスクトップアプリケーション、Web アプリケーション、またはヘッドレスマシンからのブラウザベースのアクセスをサポートします。

    Basic 認証

    Basic 認証を使用するようにWordPress を設定する前に:

    • WordPress ログインに管理者権限があることを確認してください。
    • ローカルホストで実行されているWordPress のバージョンを確認します。(WordPress 4.7 以降はネイティブでWordPress REST API サポートしていますが、それより前のバージョンでは、REST API へのアクセスを安全に行うには、Basic 認証プラグインの使用が必要です。)
    Basic 認証を構成するには:
    1. WordPress ホストにログインします。
    2. 4.7より前のバージョンのWordPress を実行している場合は、REST API プラグインをインストールしてください。
    3. Basic Authentication プラグインをインストールします。
    4. カスタムタクソノミーを作成するには、Simple Taxonomy Refreshed をインストールします。プラグインを手動でインストールしたい場合は、圧縮されたフォルダをwp-content\plugins フォルダに展開してからWordPress 管理者インターフェース経由でプラグインを有効にします。
    5. 次の接続プロパティを設定します。
      • AuthSchemeBasic
      • Url:WordPress URL。
      • User:ユーザーネーム。
      • Password:パスワード。
    OAuth 2.0 認証についてはヘルプドキュメントを参照してください。
  4. 「Save & Test」をクリック
  5. WordPress 接続の追加ページで「Permissions」タブに移動し、ユーザーベースのアクセス許可を設定します。

Personal Access Token の作成

REST API、OData API、または Virtual SQL Server を介して Connect AI に接続する場合、Personal Access Token(PAT)を使用して Connect AI への接続を認証します。アクセスの粒度を維持するために、サービスごとに個別の PAT を作成することをお勧めします。

  1. Connect AI アプリの右上にある歯車アイコン()をクリックして設定ページを開きます。
  2. 設定ページで「Access Tokens」セクションに移動し、「 Create PAT」をクリックします。
  3. PAT に名前を付けて「Create」をクリックします。
  4. Personal Access Token は作成時にのみ表示されるため、必ずコピーして安全な場所に保存してください。

Axios 用に WordPress エンドポイントを設定

WordPress に接続したら、目的のテーブル用のワークスペースを作成します。

  1. 「Workspaces」ページに移動し、「 Add」をクリックして新しいワークスペースを作成します(または既存のワークスペースを選択)。
  2. Add」をクリックしてワークスペースに新しいアセットを追加します。
  3. WordPress 接続(例: WordPress1)を選択して「Next」をクリックします。
  4. 操作するテーブルを選択して「Confirm」をクリックします。
  5. ワークスペースの OData サービス URL をメモしておきます(例: https://cloud.cdata.com/api/odata/{workspace_name})。

接続、PAT、ワークスペースが設定できたので、Axios からWordPress のデータに接続する準備が整いました。

Axios ワークフローで WordPress のデータに接続

OData プロトコルを使用して Axios から CData Connect AI への接続を確立するには、以下のステップに従います。

  1. Web アプリ用のプロジェクトディレクトリを作成します(例: ~/connect_cloud/
  2. ターミナルを開き、プロジェクトディレクトリに移動して以下のコマンドで node プロジェクトを初期化します:
    npm init -y
  3. 以下のコマンドでプロジェクトに Axios 依存関係をインストールします:
    npm install axios
  4. プロジェクトディレクトリに以下のコードを含む server.js ファイルを作成します。CData Connect AI のユーザー名(例: user@mydomain.com)と PAT(前提条件で作成した PAT)を指定します。また、SELECT * FROM WordPress1.SCHEMA.Categories のようなデータクエリも指定する必要があります。

    server.js コード

          const axios = require('axios')
    
          const user = 'user@mydomain.com'
          const pat = '***********************************';
    
          //API エンドポイント
          const url = 'https://cloud.cdata.com/api/odata/{workspace_name}';
    
          //POST リクエストで送信するデータ
          const data = {
          "query":"SELECT * FROM {workspace_name}.SCHEMA.Categories"
          };
    
          axios.post(url, data, {
          auth: {
          username: user,
          password: pat
          }
          })
          .then(response => {
          const rows = response.data.results[0].rows;
          const schema = response.data.results[0].schema;
    
          //カラム名の配列を作成
          const columnNames = schema.map(col => col.columnName);
    
          //各行をループして、カラム名と値をログ出力
          rows.forEach(row => {
          const rowObject = {};
          row.forEach((value, index) => {
          const columnName = columnNames[index];
          rowObject[columnName] = value;
          });
          console.log(rowObject);
          })
          })
          .catch(error => {
          console.error('Error:', error);
          });
        
  5. ターミナルで以下のコマンドを実行してサーバーを起動します:
    node server.js
    クエリ結果が表示されます:
        { ID: 1, VALUE: -2 }
        { ID: 2, VALUE: 1 }
        { ID: 11, VALUE: null }
        { ID: 3, VALUE: 2 }
        { ID: 4, VALUE: 5 }
        ...

クラウドアプリケーションから WordPress のデータへの簡易アクセス

これで、Axios からライブWordPress のデータへの直接接続が確立されました。Axios のようなクラウドアプリケーションから 100 以上の SaaS、ビッグデータ、NoSQL ソースへの簡易アクセスについての詳細は、Connect AI ページを参照してください。

はじめる準備はできましたか?

CData Connect AI の詳細、または無料トライアルにお申し込みください:

無料トライアル お問い合わせ