Appsmith で Adobe Experience Manager 連携アプリケーションを作成

Cameron Leblanc
Cameron Leblanc
Senior Technology Evangelist
Appsmith でCData Connect AI を介して Adobe Experience Manager のデータ に接続し、Adobe Experience Manager のデータ にリアルタイムでアクセスできるカスタムビジネスアプリケーションを作成。

Appsmith は、チームがビジネスオペレーションを改善するためのUI を素早く簡単に構築できる、オープンソースの内部ツールビルダーです。CData Connect AI と組み合わせることで、ビジネスアプリケーションから Adobe Experience Manager のデータ に即座にアクセスできるようになります。この記事では、Connect AI を使用して Adobe Experience Manager に接続し、Appsmith で Adobe Experience Manager のデータ から基本的なアプリケーションを作成するプロセスを説明します。

CData Connect AI は、Adobe Experience Manager を含む数百のデータソースをSQL Server 互換エンドポイントとして公開するクラウドサービスです。Appsmith からは通常のSQL Server と同じ手順で接続でき、レプリケーション不要でライブのAdobe Experience Manager のデータを利用できます。

Appsmith 用に Adobe Experience Manager への接続を構成

Appsmith から Adobe Experience Manager への接続は、CData Connect AI を介して行います。Appsmith から Adobe Experience Manager のデータ を操作するには、まず Adobe Experience Manager 接続を作成して構成します。

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

    Adobe Experience Manager（AEM）の WebDAV 経由で JCR リポジトリを公開するインスタンスに接続します。オンプレミスの AEM と AEM as a Cloud Service の両方のデプロイメントに対応しています。

    接続するには、以下のプロパティを設定してください。

    • URL: WebDAV 対応の JCR サーバー URL。
      • AEM as a Cloud Service: https://author-pXXXXX-eXXXXX.adobeaemcloud.com/crx/server
      • ローカル開発: http://localhost:4502/crx/server
    • User: AEM のユーザー名。
    • Password: AEM のパスワード。

    注意: テーブルは JCR リポジトリの構造に基づいて動的に生成されます。設定したユーザーが AEM リポジトリ内の必要なコンテンツパスにアクセスするための十分な権限を持っていることを確認してください。

    接続の構成（Salesforce を表示）
  4. Save & Test をクリックします
  5. Add Adobe Experience Manager Connection ページのPermissions タブに移動し、User-based permissions を更新します。 権限の更新

パーソナルアクセストークンの追加

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

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

接続が構成され、PAT が生成されたので、Appsmith から Adobe Experience Manager のデータ に接続する準備が整いました。

ライブ Adobe Experience Manager のデータ からAppsmith アプリケーションを作成

Appsmith からCData Connect AI Virtual SQL Server への接続を確立するには、以下の手順に従います。

Appsmith で Adobe Experience Manager に接続

  1. Appsmith インスタンスにログインし、新しいアプリケーションを作成します。
  2. 新しいアプリケーションで、Data ページを開き、Bring your data を選択します。 Data ページを開く
  3. このページで、Microsoft SQL Server を検索し、データソースとして選択します。 Microsoft SQL Server データソースの選択
  4. 新しいデータソースの名前を入力し、以下の接続設定を入力します。
    • Host address: tds.cdata.com
    • Port: 14333
    • Database name: 接続するCData Connect AI データソースの接続名を入力します（例：AdobeExperienceManager1）。
    • Username: CData Connect AI のユーザー名を入力します。これはCData Connect AI インターフェースの右上に表示されます。例：[email protected]。
    • Password: 先ほど生成したPAT を入力します。
      • Connect AI Virtual SQL Server への接続を構成（Salesforce を表示）
  5. Test configuration をクリックして接続が成功したことを確認し、Save をクリックしてデータソースを保存します。

新しいクエリを作成

データソースへの接続を構成したら、SQL クエリを追加してデータソースから実際にデータを取得します。

  1. 新しいデータソースの画面で、New Query をクリックします。 新しいクエリの作成
  2. クエリエディタが開き、データを選択するSQL クエリを入力できます。SQL クエリの指定については、CData Connect AI のExplorer を使用して、SQL クエリと取得するデータをプレビューできます。 Explorer でクエリをプレビュー
  3. SQL クエリを作成したら、Appsmith のクエリエディタに戻り、SQL クエリを入力してRun をクリックします。 SQL クエリの実行
  4. クエリが正常に実行されたら、あとは取得したデータを表示するためのページをセットアップするだけです。

Adobe Experience Manager のデータ を表示

  1. UI タブを開き、New UI element をクリックします。 新しいUI 要素
  2. 新しいUI 要素を選択し、ページ上にドラッグアンドドロップします。 新しいUI 要素
  3. 新しいUI 要素でConnect data をクリックし、先ほど作成したクエリを選択します。 データに接続
  4. データが接続されると、UI 要素にデータが表示されます。 UI 要素に接続完了

アプリケーションをデプロイ

Adobe Experience Manager のデータ がアプリケーションのUI 要素に接続されたら、アプリケーションをデプロイできます。Appsmith の右上にあるDeploy をクリックすると、Adobe Experience Manager のデータ を表示するアプリケーションが別ウィンドウで開きます。

アプリケーションのデプロイ完了

CData Connect AI の入手

クラウドアプリケーションから数百種類のSaaS、ビッグデータ、NoSQL ソースへのリアルタイムデータアクセスを実現するには、CData Connect AI をお試しください。

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

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

無料トライアル

この記事の内容

関連記事