AppCenterでWPF(PRISM)アプリのユーザ操作履歴ログを収集し、収集したログをWebで閲覧する。

WPFがAppCenterで利用できるようになったので、イベントログの収集機能を試してみました。

まずApp Centerとは？

アプリケーションの運用に関わる様々な機能を提供します。
・アプリケーションのイベントログを収集でき、Webで可視化することができる。
・アプリケーションのクラッシュログを収集でき、Webで可視化することができる。
・アプリケーションの配付ができる。アプリケーションの初回インストールや、バージョンアップの度に通知する。

本記事で収集するログの内容

イベントログとして、ユーザの操作履歴ログを収集します。
具体的には、
・"どの画面で"
・"どのボタンが"
・"クリックされたのか"
を収集します。

ログ収集のためのサンプルアプリケーションを紹介

どの画面でどのボタンがクリックされたか？のログ収集テストのため、
３つの画面と、それぞれの画面に"検索","登録","更新"ボタンを配置したサンプルアプリケーションを作成しました。

収集したログをAppCenter(Web)から参照

サンプルアプリケーションを画面を切り替えつつ、各ボタンをクリックしてログをため込みました。
では、AppCenterではどのように参照できるのか？　確認していきます。

Analytics > Log flow

App CenterをWebで開き、 Analytics > Log flow　を開きます。
全てのログが閲覧できます。

オレンジ枠　…　利用ユーザーごとの一意ID
赤枠 … 画面名
青枠 … ボタンの表示名(Button.Content)、ボタン名(Button.Name)

が設定されていることが確認できます。

Analytics > Events

App CenterをWebで開き、 Analytics > Events　を開きます。
この画面では、イベント毎のログが確認できます。

…が、本記事ではEvent = 画面IDを設定しました。
そのため、Eventsで開いた画面では、各画面毎のIDが表示されています。

そして、次に画面(PageA.Views.PageAView)を選択すると、各画面のイベント発生状況が確認できます。

AppCenter(Web)のログ機能で分かること。

"Log flow"および、"Events"の２つの画面からログしましたが、

ユーザ毎の操作手順は、"Log flow"
画面のイベント発生状況(よく利用される機能)は、"Events"

で確認することが出来ました。
送信する情報を工夫することで、より実用的な情報収集も、簡単に行うことが出来そうです。
(テキストボックスの入力情報など)

ちなみに、このサンプルアプリケーションでは、無差別にボタンのクリックイベントをトリガーしているので、左側のメニューのボタンもログ収集の対象となり、かつ、表示中の画面(ContentRegion)に所属しているボタンというわけではないけど、、そこは、まぁ。作り込めばなんとか出来るので今回はご容赦ください。

サンプルアプリケーションの解説

GitHubはこちら。
https://github.com/furugen/PrismSampleWithAppCenter

それぞれの要点だけ簡単に説明します。

動作確認のためには、シークレットコードを設定する

もし、お試しで動作させる場合は、あなたのAppCenterのシークレットコードを設定してください。
これだけで動作できます。

        protected override Window CreateShell()
        {
            AppCenter.Start("あなたのシークレットコード",
                   typeof(Analytics), typeof(Crashes));

            return Container.Resolve<MainWindow>();
        }

実装ポイント

どの画面で

　つまり、どの画面が今表示されているのか？
　PRISMのRegionManagerでActiveViewを取得しています。

var activeView = this.regionManager.Regions["ContentRegion"].ActiveViews.First();

どのボタンが

　全てのボタンに対して、EventSetter / Clickイベントにログを出力するための処理を登録します。

    <Window.Resources>
        <!-- 全てのButtonのクリックイベントを監視 -->
        <Style TargetType="Button">
            <EventSetter Event="Click" Handler="Button_Click"/>
        </Style>
    </Window.Resources>

AppCenterへのログ登録内容

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            if(this.regionManager.Regions["ContentRegion"].ActiveViews.Count() > 0)
            {
                Button btn = sender as Button;
                var activeView = this.regionManager.Regions["ContentRegion"].ActiveViews.First();

                Analytics.TrackEvent(activeView.ToString(), new Dictionary<string, string> {
                    { "ButtonName", btn.Name },
                    { "ButtonContent", btn.Content?.ToString() }
                });
            }
        }

まとめ

AppCenterをWPF+PRISMで活用するには？という観点でサンプルアプリケーションを作ってみましたが、
なかなか便利ですね。次は、配布(Distribute)の機能や、クラッシュログを試してみようかと思います。