harファイルをローカルで表示できる「HAR Viewer」

HARというデータを見る方法について書きます。

例えば、Google ChromeでデベロッパーツールのNetworkを開くと下のように表示されます。(表示されない場合は再読み込みをします)

Networkの所で右クリックして表示される「Copy as all HAR」を選択します。

har

ローカル環境で表示する方法

これをローカル環境で表示するためにGoogleコードより、harviewerをダウンロードします。

ダウンロードしたファイルを解凍して、展開されたファイルが入ったディレクリごと、phpプログラムが動く場所(XAMPP等)に移動させます。

ブラウザを立ち上げて、harviewer(例:http://localhost/harviewer/)を開きます。

Homeタブを選択して、テキストエリアの上にある「validate data before processing?」のチェックをはずして、先ほど「Copy as all HAR」をクリックしてコピーしたものをそのまま貼り付け(ペースト)し、「Preview」ボタンをクリックします。

har1

データの解析が終わると、「Preview」タブに切り替わり、ブラウザでデータを見ることができます。

har2

オンラインで見たい場合、こちらのサイトで見ることできます。
サイトにあるCheck out onlineのリンク先に同じものがあります。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です