参加者のOS,ブラウザ,デバイスなどを検出したい場合があります。lab.js Builderではmetadataプラグインがデフォルトで組み込まれており,このプラグインによって参加者の環境情報を取得しています。詳しくはmetadataプラグインの説明を参照してください。

Plugins - lab.js 20.0.1 documentation

このプラグインで取得した情報はデータのmetaという列に保存されます。metaに含まれている要素のうち,userAgentとplatformにOS,ブラウザ,デバイスの情報が記録されています。したがって,このどちらかを用途に合わせて取得しましょう。

例えば,MacBookProのChromeでlab.jsを実施した場合,userAgentとplatformにはそれぞれ以下のようなデータが記録されています。

これらの情報は,this.state.meta.userAgentthis.state.meta.platformのそれぞれで取得することができます。ただし,before: prepareのタイミングでは取得が間に合わないそうなので,それ以降のタイミングで参照する必要がありますが,metaのTardyにチェックをいれることで参照するという方法があります。例えば,以下のようにPageコンポーネントを追加して,それぞれ,userAgentとplatformを表示するというテキストを追加します。

このまま動かしても,うまく動かないので,「Behavior」タブの「Meta」にある「Tardy」にチェックをいれてください。

そうすると,試行の動作の直前のタイミング((おそらく,metadataが取得された後)で情報を取得してくれるので,userAgentとplatformが以下のように表示されるはずです(実行環境によって表示される内容は異なります)。

これらの情報を元に条件分岐を行うことで,パソコンとスマホで異なるページを表示することなどを実装できるでしょう。

コード

上記の例で紹介したコードは以下からダウンロードできます。右クリックで保存してください。

getPlatform.json

©2020 Masanori Kobayashi