Datadog Session Replayの導入による効果 - LegalOn Technologies Engineering Blog

はじめに

こんにちは、株式会社LegalOn Technologies (以下 LegalOnと呼びます) SRE&プラットフォームグループの加藤です。

LegalOnでは、2019年4月に『LegalForce』、2021年1月に『LegalForceキャビネ』を正式リリースして以来、機能追加やUI/UXの改善などのアップデート、バックエンドやインフラの改善を行っています。さらにはリリース初期段階では予期できなかった技術的な課題への対応や、発見された不具合の修正も行っています。サービスにおいて不具合が発生したときの影響は、機能数とユーザー数が増えていくにつれ大きくなります。そのため、万が一不具合が発生した場合は、迅速に対応し解決しなければなりません。

そこで、今回はモニタリングサービスであるDatadog(https://www.datadoghq.com/ja/)のSession Replayという機能を使い、不具合への対応や、UX改善のためにユーザーの行動解析に役立てることができた事例について紹介します。

抱えていた課題

LegalOnでは、2020年からDatadogを利用し、RUM(Real User Monitoring)を行っていました。ですが、検知した不具合の原因特定まで時間がかかることが多く、原因特定ができていたとしても、潜在的なUXの問題について能動的に発見することが難しい状態でした。

これらの課題に対して、別のモニタリングサービスを利用せず、すでに導入していたDatadogを用いることができないかと考えました。

Session Replayの導入

DatadogのSession Replayという機能を利用することで、ユーザーがサービスをどのように使用しているかをセッション単位で映像として記録し、再生することができます。また、DatadogのJavaScriptライブラリの @datadog/browser-rum を導入し、importして利用することができます。

import { datadogRum } from '@datadog/browser-rum';

datadogRum.init({
  applicationId: '<DATADOG_APPLICATION_ID>',
  clientToken: '<DATADOG_CLIENT_TOKEN>',
  site: '<DATADOG_SITE>',
  sessionSampleRate: 100,
  sessionReplaySampleRate: 100,
  defaultPrivacyLevel: 'mask',
  ...
});

datadogRum.startSessionReplayRecording();

参考: https://docs.datadoghq.com/ja/real_user_monitoring/session_replay/#使用方法

Session Replay導入時の注意点

ユーザーの機密情報をマスクする

Session Replayが導入されると、ユーザーがブラウザで操作した内容をすべて映像として記録することができます。この取得した情報は不具合の特定に役立てることができます。

ですが、このとき気をつけなればならないことがあります。

LegalOnが提供している『LegalForce』では、ユーザーが作成する契約書を扱います。この契約書には「契約当事者の情報」や「サービスを利用しているユーザー情報」などのユーザーの機密情報があり、何も考慮せずにSession Replayを導入した場合、意図せずこれらを取得してしまう可能性があります。

我々は「Session Replayにおいて、ユーザーの機密情報を取得しないこと」を要件として設定しました。

この要件を満たすために、Session Replay導入時にdatadogRumの初期化オプションにdefaultPrivacyLevel: 'mask' という設定を加えました。これにより、すべてのHTMLテキスト、ユーザー入力、画像、リンクなどの情報がマスク処理がされます。

参考: https://docs.datadoghq.com/ja/real_user_monitoring/session_replay/privacy_options/#マスクモード

このマスク処理は、ユーザーのブラウザで行われた後にDatadogサーバーに送信されます。そのためDatadogサーバーではマスクされた状態でユーザーの操作が保存され、元の情報を復元することはできません。

defaultPrivacyLevelオプションを指定しない場合はデフォルトで mask-user-inputが設定されます。この設定は入力、テキストエリア、チェックボックスの値など、フォームフィールドの内容をマスクされるようになります。ですが、これでは入力以外に記載されている機密情報を意図せず取得してしまい要件を満たせないため maskを設定しました。

参考: https://docs.datadoghq.com/ja/real_user_monitoring/session_replay/privacy_options/#ユーザー入力マスクモード

Datadog Session Replay の通信要件を確認する

Session Replayを有効化することによりユーザーのブラウザからの通信は、提供しているサービスの他にDatadogに対しても発生します。ユーザーの作業環境で監査ソフトなどを導入している場合、サービスのユーザー体験を損ねる可能性があります。

そのため、RUM & セッションリプレイ - SDKドメインの対応エンドポイントからどのサイトへどのような通信が発生するのかを確認した上で、『LegalForce』のシステム動作要件ドキュメントを更新しユーザーへ周知しました。

情報を取得したいページの確認

Session Replayは付与されたCookieに依存してセッション情報を保存し、各ページにおけるユーザーセッションをトラッキングします。このCookieはクロスサイトトラッキングには使用されないため、同一のドメインでのみトラッキングが可能です。例えば、以下のように異なるドメインの場合には同一ユーザーのアクセスであったとしても別のセッションとしてトラッキングされます。また、それぞれのドメインのページにおいてSession Replayを有効化する設定が必要です。

app.example.com
blog.example.com

単純に *.example.com のようなワイルドカードによる設定などはできません。

参考: https://docs.datadoghq.com/ja/real_user_monitoring/browser/troubleshooting/#rum-クッキー

導入効果

これまでDatadog RUM(Real User Monitoring)を導入してエラーなどの不具合の検知に役立てておりましたが、Session Replayを導入することにより、ユーザーの操作を機密情報を除いた映像として確認できるようになり、不具合原因の特定にかかる時間を短縮することができました。さらに、これまで把握することが難しかった潜在的なUXの問題についても能動的に把握することができ、サービスの改善に役立てることができています。

また、ユーザーサポートチームがSession Replayを閲覧できるようにDatadogアカウントを発行しました。これによりユーザーの具体的な操作を把握できるようになったため、的確なサポートを行えるようになりました。

さらに新規機能をリリースしたあと、実際に自分たちが作った機能が利用されていることが映像で確認できるため、開発者のモチベーションアップにも繋がりました。