3.2. 前処理のサンプル実装¶
ここでは3つの前処理の実装方式でサンプル実装を作成します。前述の通り、前処理はルーティング定義に紐づくものなので、3つの前処理の実装方式に1つずつ、計3つのルーティング定義を作成します。 一方で、コンテンツは1つだけ作成します。このコンテンツは3つのルーティング定義に共通で使用します。
3.2.1. コンテンツの作成¶
まず共通に使うコンテンツを作成します。
「サイトマップ」→「IM-BloomMaker」→「コンテンツ一覧」で、「コンテンツ一覧」画面を表示し、「カテゴリ新規作成」リンクをクリックします。 画面右側の「カテゴリ名」に「プログラミングガイド」と入力し、「登録」ボタンをクリック、「登録確認」ダイアログで「決定」ボタンをクリックします。
次に作成した「プログラミングガイド」カテゴリを選択した状態で「コンテンツ新規作成」リンクをクリックします。 画面右側の「コンテンツ名」に「サンプル」と入力し、「登録」ボタンをクリック、「登録確認」ダイアログで「決定」ボタンをクリックします。
「デザイン編集」ボタンをクリックし、デザイナ画面を開きます。
実装した前処理の結果を受け取るためには、Im-BloomMakerのデザイナ画面で入力を設定する必要があります。右側の「変数」タブをクリック、変数のドロップダウンで「入力」を選択し、入力を設定します。設定内容は次の通りです。
エレメントは以下のように配置します。
foo の右側のラベルの textContent には $input.foo を指定します。 calendarId の右側のラベルの textContent には $input.accountContext.calendarId を指定します。
他の項目も同様に、テーブルの左側の文字列と同じキーの変数を右側のラベルのプロパティ textContent に指定します。
3.2.2. Java による前処理の実装¶
Java で前処理を実装するには、 jp.co.intra_mart.foundation.bloommaker.route.preprocess.BMContentPreprocessor を実装したクラスを作成してください。
public class PreProcessor implements BMContentPreprocessor {
    @Override
    public Map<String, Object> execute(final BMContentPreprocessorContext context) throws BloomMakerException {
        // 返却するマップ
        final Map<String, Object> result = new HashMap<>();
        // 単純なkey-valueをセットします。
        result.put("foo", "bar");
        // アカウントコンテキストをセットします。
        final Map<String, Object> accountContextMap = new HashMap<>();
        final AccountContext accountContext = Contexts.get(AccountContext.class);
        accountContextMap.put("calendarId", accountContext.getCalendarId());
        accountContextMap.put("encoding", accountContext.getEncoding());
        accountContextMap.put("userCd", accountContext.getUserCd());
        result.put("accountContext", accountContextMap);
        // リクエストパラメータを取得します。
        final String targetLocale = (String) context.getParsedRequestParameters().get("locale");
        // 取得したロケールに応じたフォーマットで現在日時をフォーマットします。
        final DateTimeFormatSetInfo[] formats = SystemDateTimeFormat.getFormatSets();
        final String formatsetId = Arrays.asList(formats).stream()
                .filter(format -> format.getLocale().toString().equals(targetLocale))
                .findFirst().map(format -> format.getFormatSetId())
                .orElse(SystemDateTimeFormat.getDefaultFormatSet().getFormatSetId());
        final String format = SystemDateTimeFormat.getFormats(formatsetId)
                .get("IM_DATETIME_FORMAT_DATE_STANDARD");
        final DateTimeFormatter formatter = DateTimeFormatter.withPattern(format);
        result.put("currentDate", formatter.format(new Date()));
        // 結果として、次のようなオブジェクトを返します。
        // {
        //   "foo": "bar",
        //   "accountContext": {
        //     "calendarId": "カレンダーID",
        //     "encoding": "エンコーディング",
        //     "userCd": "ユーザコード"
        //   },
        //   "currentDate": "ロケールに応じた現在日時"
        // }
        return result;
    }
}
ルーティングは以下のように定義します。
ルーティングに指定した URL にアクセスすると、以下のように表示されます。
URLに ?locale=ja を追加すると、currentDate の表示が変化します。
3.2.3. JavaScript(スクリプト開発モデル)による前処理の実装¶
上記の Java による前処理プログラムを JavaScript(スクリプト開発モデル)でも実装してみます。
JavaScript で前処理を実装するには、 execute 関数を実装したスクリプトを作成してください。
function execute(context) {
  // 引数の context は以下のような構造のオブジェクトです。
  //
  // {
  //   path: 'リクエストのパス',
  //   pathvariables: {},  // パス変数
  //   content: {}, // コンテンツの情報
  //   parsedRequestParameters: {}, // 解析済みリクエストパラメータ情報
  //   request: {} // 生のリクエストオブジェクト
  // }
  // 返却するマップ
  let result = {};
  // 単純なkey-valueをセットします。
  result.foo = "bar";
  // アカウントコンテキストをセットします。
  let accountContext = Contexts.getAccountContext();
  let accountContextMap = {
    calendarId: accountContext.calendarId,
    encoding: accountContext.encoding,
    userCd: accountContext.userCd
  };
  result.accountContext = accountContextMap;
  // リクエストパラメータを取得します。
  let targetLocale = context.parsedRequestParameters.locale;
  // 取得したロケールに応じたフォーマットで現在日時をフォーマットします。
  let formats = SystemDateTimeFormat.getFormatSets().data;
  let formatsetId = SystemDateTimeFormat.getDefaultFormatSet().data.formatSetId;
  for (let i = 0, len = formats.length; i < len; i++) {
    let format = formats[i];
    if (format.locale === targetLocale) {
      formatsetId = format.formatSetId;
      break;
    }
  }
  let format = SystemDateTimeFormat.getFormats(formatsetId).IM_DATETIME_FORMAT_DATE_STANDARD;
  result.currentDate = DateTimeFormatter.format(format, new Date())
  // 結果として、次のようなオブジェクトを返します。
  // {
  //   "foo": "bar",
  //   "accountContext": {
  //     "calendarId": "カレンダーID",
  //     "encoding": "エンコーディング",
  //     "userCd": "ユーザコード"
  //   },
  //   "currentDate": "ロケールに応じた現在日時"
  // }
  return result;
}
作成したスクリプトは、 programming_guide/sample.js として保存します。
ルーティングは以下のように定義します。
ルーティングに指定した URL にアクセスすると、以下のように表示されます。
URLに ?locale=ja を追加すると、currentDate の表示が変化します。
3.2.4. IM-LogicDesigner のフロー定義による前処理の実装¶
上記の Java による前処理プログラムを IM-LogicDesigner でも実装してみます。
IM-LogicDesigner の JavaScript 定義を新規に作成し、以下のような実装を行います。
function run(input) {
  // 返却するマップ
  const result = {};
  // 単純なkey-valueをセットします。
  result.foo = "bar";
  // アカウントコンテキストをセットします。
  const accountContext = Contexts.getAccountContext();
  const accountContextMap = {
    calendarId: accountContext.calendarId,
    encoding: accountContext.encoding,
    userCd: accountContext.userCd
  }
  result.accountContext = accountContextMap;
  // リクエストパラメータを取得します。
  const targetLocale = input.locale;
  // 取得したロケールに応じたフォーマットで現在日時をフォーマットします。
  let formatsetId = SystemDateTimeFormat.getDefaultFormats()['format-set-id'];
  const formats = SystemDateTimeFormat.getFormatSets();
  if (!formats.error) {
    const formatsData = formats.data;
    for (let i = 0, len = formatsData.length; i < len; i++) {
      if (formatsData[i].locale === targetLocale) {
        formatsetId = formatsData[i].formatSetId;
        break;
      }
    }
  }
  const format = SystemDateTimeFormat.getFormats(formatsetId).IM_DATETIME_FORMAT_DATE_STANDARD;
  result.currentDate = DateTimeFormatter.format(format, new Date());
  // 結果として、次のようなオブジェクトを返します。
  // {
  //   "foo": "bar",
  //   "accountContext": {
  //     "calendarId": "カレンダーID",
  //     "encoding": "エンコーディング",
  //     "userCd": "ユーザコード"
  //   },
  //   "currentDate": "ロケールに応じた現在日時"
  // }
  return result;
}
入力値は以下のように定義します。
JSON入力に以下の JSON をペーストし、全ての項目を置き換えることでも定義できます。
入力
{
  "request": {
    "locale": ""
  }
}
出力
{
  "foo": "",
  "accountContext": {
    "calendarId": "",
    "encoding": "",
    "userCd": ""
  },
  "currentDate": ""
}
ユーザ定義IDなど、他の項目は適当な値を入力、選択してください。今回はユーザ定義IDを preprocessor とします。
次にフロー定義を作成します。
入出力設定を以下のように定義します。
次に先ほど作成したユーザ定義を配置し、開始と終了に接続します。
最後にマッピング設定を行います。
preprocessor のマッピング定義は以下のように定義します。
終了のマッピング定義は以下のように定義します。
新規保存します。フロー定義IDなど適当な値を入力してください。今回はフローIDなどを preprocessor とします。
コンテンツは上記のものを再度利用します。 ルーティングは以下のように定義します。
ルーティングに指定した URL にアクセスすると、以下のように表示されます。
URLに ?locale=ja を追加すると、currentDate の表示が変化します。
3.2.5. サンプル実装の資材¶
Java、JavaScript による前処理の実装のユーザモジュール
- IM-Juggling でユーザモジュールとして追加してください。
 - ソース
 
- 
LogicDesigner のインポートからインポートしてください。
以下のフローが定義されます
- フローカテゴリ : BloomMaker
 - フロー定義ID : preprocessor
 - フロー定義名 : preprocessor
 
 - 
BloomMaker のインポートからインポートしてください。
以下のコンテンツ、ルーティング定義が定義されます。
コンテンツ
プログラミングガイド
- サンプル
 
ルーティング定義
プログラミングガイド
- サンプル
 - サンプル2
 - サンプル3
 
 
注意
上記ファイルのインポート後、IM-BloomMaker ルーティング定義の認可の設定を行ってください。