アプリ接客の導入
アプリ接客の設置パラメータ
b→dash mobile SDKで付加できるパラメータや定数については下記となります。
| 利用シーン | 名称 | 説明 |
|
・show() の引数
・report()の引数 ・View設置時 のパラメーター |
targets | ターゲット |
| trigger |
トリガー
TRIGGER_DEFAULT：デフォルト TRIGGER_BOOT：起動トリガー TRIGGER_VIEW：View表示トリガー TRIGGER_TOUCH：タッチ（クリック）トリガー TRIGGER_SCROLL：スクロールトリガー |
|
| view | 現在のスクリーン名 | |
| page | 現在のページ名 | |
| preView |
一つ前のスクリーン名
※b→dash管理画面未対応のため、現在利用できません。 |
|
| prePage |
一つ前のページ名
※b→dash管理画面未対応のため、現在利用できません。 |
|
| eventFunc |
関数名を指定
※b→dash管理画面未対応のため、現在利用できません。 |
|
| customProperty | カスタムプロパティ。連想配列key=value | |
|
・View設置時
のパラメーター |
visibility |
インスタンスが作られた（画面遷移）時の「ポップアップ表示状態」を制御する。
true: 表示する(default) false: 表示しない。report()のみ利用するときなど |
| onAction |
・ポップアップ内で発生したイベントをハンドリングする関数を指定します。
onActionWebReception = (event)=> { if (event.eventType == EventType.INTERNAL) { // クリックされたイベントの値を取得する var key = event.parameter['key']; var test = event.parameter['test']; // 値をもとに処理 } } ・引数の event は Object型で、下記のようなデータ構造になります { eventType: 0, parameter: { 'key': 'test', 'test': 'test2', }, } ・eventTypeは下記定数のいずれかが来ます INTERNAL= 0; WEBVIEW= 1;（※) （※) WEBVIEW そのものは現在、正式にサポートしておりません。 |
|
| ref |
ref={(component)=>{
this.bdashWebReception = component; }} ・他のシーンで アプリ接客を制御するためのインスタンスを記憶します。例えばボタン押下時にポップアップを表示させたいときは、 var report = this.bdashWebReception.getReport(); this.bdashWebReception.show( report ); 上記のように呼び出します。 |
アプリ接客のAPI組み込み
以降、JavaScriptでのアプリ接客使用例となります。
ポップアップ表示準備
ポップアップを表示するにはBDashWebReceptionViewクラスにタグを設定しshow()関数を呼び出す必要があります。getReport()関数でタグで指定した初期値を取得でき、送信したパラメーターはb→dash 画面側と連動します。パラメータの変更例は以下の通りになります。
var options = getReport();
options["Targets"] = ["ターゲット1"]; // 設定必須: ターゲットを指定します
options["trigger"] = Trigger.TRIGGER_DEFAULT; // 設定推奨: トリガーを設定します
options["view"] = "商品画面"; // 設定推奨: 現在のスクリーン名を設定します
options["preview"] = "商品一覧画面"; // 任意: ひとつ前のスクリーン名を設定します
options["page"] = "ProductDetailFragment"; // 設定推奨: 現在のページ名を設定します
options["prePage"] = "ProductListFragment"; // 任意: ひとつ前のページ名を設定します
options["eventFunc"] = "onPageFinish"; // 任意：発生した関数名を設定します
options["customProperty"] = null; // 任意：カスタム値を設定します
// show関数の呼び出し 2021/2時点、trigger, preView, prePage, eventFunc は b→dash 管理画面での設定項目がございませんので、利用することができません。詳細はカスタマーサクセス担当までお問い合わせください。
JavaScriptからアプリ接客を呼び出す
JavaScriptからb→dash mobile SDKのアプリ接客機能を呼び出すサンプルコードです。
import BDashWebReceptionView, { Trigger, EventType }
from './src/bdash/BDashWebReceptionView';
export default class UserApplicattion extends Component {
〜 省略
render() {
return (
〜 省略 〜 本タグは最後に設定します. style は設定しないで下さい.
<BDashWebReceptionView
targets={['1000']}
trigger={ Trigger.TRIGGER_DEFAULT }
view={'現在の画面'}
preView={'一つ前の画面'}
page={'現在のページ'}
prePage={'一つ前のページ'}
eventFunc={'イベント関数'}
customProperty={{ test: 'value' }}
onAction={this.onActionWebReception}
ref={(component) => { this.bdashWebReception = component; }}
/>
);
}
// ポップアップを表示
show() {
options = this.getReport()
〜 省略
this.bdashWebReception.show(options);
}
// レポートを送信
report() {
options = this.getReport();
〜 省略
this.bdashWebReception.report(options);
}
// ポップアップ内のイベント
onActionWebReception (event) {
var parameter = event.parameter;
for (var key in parameter) {
var val = parameter[key];
if (event.eventType == EventType.INTERNAL) {
// インターナルイベント
} else if (event.eventType == EventType.WEBVIEW) {
// WebViewイベント
}
console.log('parameter::' + key + '=' + val);
}
}
// 「BDashWebReceptionView タグ設置時」の初期パラメーターをコピーして取得する
getReport() {
return this.bdashWebReception.getReport();
}
}