ビューアドオンAPIを使用することにより、Appsで編集した値をテンプレートに出力、また制御することができます。
このAPIを利用した実例について、 Apps活用事例 にて掲載しておりますので、こちらの内容と併せてご覧いただけますと幸いです。
以下、ビューアドオンAPIの使用方法について説明します。
まず、ビューアドオンAPIを使用する場合には、Appsの管理画面でビューアドオンルートURIを設定する必要があります。
例えばAppsコードSAMPLE_APP_CDであるAppsのビューアドオンルートURIとして「http://sample.co.jp/api/view/」を指定します。
そして、ビューアドオンAPIを使用するテンプレートのhtmlタグに以下のように属性を追加する必要があります。
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:m="http://mayaa.seasar.org" xml:lang="ja" lang="ja"
xmlns:sample="eb:SAMPLE_APP_CD/view_common.json">
※SAMPLE_APP_CD:Appsコード、sample:テンプレート内で用いる定義名
上記のような定義をすると、テンプレートを開いた際に以下のURIでAppsを呼び出します。
「http://sample.co.jp/api/view/view_common.json」
そして、Appsからの返却値を使ってテンプレート内に記述された処理を行います。
ビューアドオンAPIはhttpヘッダにX-EBISU-VIEWADDON-API-RESPONSE-VERSIONを指定することでバージョン指定ができます。
ver2以上が指定された場合、レスポンスのデータ構造が変わりクッキー情報とセッション情報を保存することができます。
レスポンスのサンプルは以下の通りです。
{ "MESSAGE":"メッセージ" }
Appsでの処理を完了したのち、JSON形式で以下の内容をレスポンスボディに入れてください。
レスポンスのサンプルは以下の通りです。
{ "result": { "MESSAGE": "メッセージ" }, "cookies": [ { "isHttpOnly": false, "isSecure": false, "maxAge": 3600, "name": "Appsコード:KEY1", "value": "VALUE1" } ], "session": { セッション情報 } }
テンプレート内で以下の定義が使用可能です。
以下、各定義についてApps側で返す値と、テンプレートの記述方法を例示します。
Appsが返すJSON
{ "MESSAGE": "メッセージ" }
テンプレートに記述する内容
<p><div sample:write="MESSAGE"></div></p>
最終的に出力されるHTML
<p>メッセージ</p>
Appsが返すJSON
{ "ORDER_NO": { "value": "ORDER-1" } }
テンプレートに記述する内容
<input type="hidden" name="cd" sample:attr="ORDER_NO" />
最終的に出力されるHTML
<input type="hidden" name="cd" value="ORDER-1" />
Appsが返すJSON
{ "FLAG1": true, "FLAG2": false, "MESSAGE1": "メッセージ1", "MESSAGE2": "メッセージ2" }
テンプレートに記述する内容
<div sample:if="FLAG1"><p><div sample:write="MESSAGE1"></div></p></div><div sample:if="FLAG2"><p><div sample:write="MESSAGE2"></div></p></div>
最終的に出力されるHTML
<div><p>メッセージ1</p></div>
FLAG1のようにtrueの場合はsample:ifを記載したタグ(上記の例では<div>)と囲んだ内容が表示され、
FLAG2のようにfalseの場合はタグも含めて非表示となります。
Appsが返すJSON
{ "MESSAGE_LIST": [ { "MESSAGE": "メッセージ1" }, { "MESSAGE": "メッセージ2" } ] }
テンプレートに記述する内容
<div sample:loop="MESSAGE_LIST"><p><div sample:write="MESSAGE"></div></p></div>
最終的に出力されるHTML
<div><p>メッセージ1</p></div><div><p>メッセージ2</p></div>
ebisumartからAPIを呼び出す時には、リクエストボディにJSON形式で以下の情報が送られます。
具体的に渡されてくるデータのサンプルは以下の通りです。
{ "cart": [ { "ADD_POINT": null, "ADD_POINT_RATE": null, "DISCOUNT_FLG": null, "FREE_ITEM1": null, "ITEMPROPERTY_LIST": "0", "ITEM_CD": "ITEM1", "ITEM_ID": 4, "ITEM_IMAGE1": "ITEM1/ITEM1.jpg", "ITEM_IMAGE2": null, "ITEM_IMAGE3": null, "ITEM_IMAGE4": null, "ITEM_ITEMPROPERTY_CD": "ITEM1", "ITEM_NAME": "商品1", "MAKER_TEIKA": null, "MAX_QUANTITY": null, "MEMBER_WARIBIKI": null, "MIN_QUANTITY": null, "M_ITEM_IMAGE1": null, "M_ITEM_IMAGE2": null, "M_ITEM_IMAGE3": null, "M_ITEM_IMAGE4": null, "ORDER_QUANTITY_LIMIT": null, "POINT_FLG": null, "QUANTITY": 1, "SALE_DATE": null, "SORYO_FREE_FLG": null, "TEIKA": 100, "TEIKI_FLG": null, "ZAIKO_DISP_FLG": null } ], "context": { "member_id": "3", "member_rank": null, "page": "/", "request": null, "shop_id": "V4-LECTURE01", "template_name": "/client_info/V4-LECTURE01/view/userweb/top.xhtml" }, "session": {}, "requestAttr": {}, "requestParams": {} }
免責事項については こちら をご参照ください。