イベント · JavaScriptクライアント

チェックアウトは、実行中の処理をページに通知します。on() で購読します。

JavaScript

entase.on('checkout.ready', payload => {
  console.log('checkout open for', payload.context.eventID);
});

イベント名ごとに 1 つのリスナー

on() は、イベント名ごとに 1 つのコールバックを保存します。同じ名前で 2 つ目のコールバックを登録すると、最初のものは置き換えられます – 追加されるわけではありません。

JavaScript

entase.on('checkout.closed', a);
entase.on('checkout.closed', b);   // a is gone; only b runs

off() は、名前に対して登録されているものをすべて削除します。渡されたコールバックは無視されるため、off('checkout.closed', b) と off('checkout.closed') は同じ動作をします。

ページ内の複数の部分で同じイベントに反応する必要がある場合は、コールバックを 1 つ登録し、その内部から処理を振り分けてください。

複数のイベントを一度に購読する

どちらのメソッドも、スペース区切りの文字列または名前の配列を受け取り、各イベントに同じコールバックを登録します。

JavaScript

entase.on('checkout.ready checkout.closed', payload => {
  console.log(payload.name);
});

entase.off(['checkout.ready', 'checkout.closed']);

ペイロード

すべてのコールバックは 1 つのオブジェクトを受け取ります。

フィールド	型	説明
`name`	string	イベント名。1 つのコールバックで複数のイベントを処理する際に役立ちます。
`context`	object	`eventID` を含みます – このチェックアウトが属するイベントです。
`data`	object	イベント固有の詳細情報。

利用可能なイベント

名前	発火するタイミング
`checkout.ready`	チェックアウトが読み込まれ、操作できる状態になったとき。クライアントが `book()` に渡した `clientContext` を引き渡すタイミングでもあります。
`checkout.closed`	チェックアウトが閉じたとき。クライアントはパネルまたはウィンドウを破棄し、背景オーバーレイをクリアします。
`checkout.consent`	訪問者が利用規約の通知に回答したとき。承諾した場合、`data.consent` は `true` になり、クライアントがその回答を記憶するため、次回はこのステップがスキップされます。

JavaScript

entase.on('checkout.closed', () => {
  document.body.classList.remove('checkout-open');
});

entase.on('checkout.consent', payload => {
  if (payload.data.consent) console.log('terms accepted');
});

リスナーは個別の予約後も維持される

リスナーは予約ではなくインスタンスに属します。クライアントの作成後に一度だけ登録すれば、すべての book() 呼び出しに適用されます。payload.context.eventID を使って予約を区別してください。

JavaScript

const entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' });

entase.on('checkout.closed', payload => {
  refreshAvailability(payload.context.eventID);
});

destroy() を呼び出すと、すべてのリスナーが停止します – インスタンスはチェックアウトからのメッセージを完全に受信しなくなります。

他の送信元からのメッセージは無視される

クライアントが受け付けるのは Entase チェックアウトのオリジンからのメッセージのみです。そのため、ページ上の無関係な postMessage トラフィックがコールバックに届くことはありません。