ページ内のTCP接続数を測定する方法

Question

chrome開発ツールでは、ページ内のリクエスト数を確認できますが、接続数を測定する方法はないようです。

クロム開発ツールでは可能ですか？そうでない場合は、代わりにどのようなツールを使用できますか？

Answer 1

[ネットワーク]パネルで[接続ID]ヘッダーを有効にすることができます。これは特定の接続の一意の識別子です。列を並べ替えると、特定の接続インスタンスに対して要求された要求の数を確認できますが、結果の数やフィルタリングの方法については組み込まれていません。

しかし、このデータは、JSON形式のファイルにエクスポートHAR（HTTPアーカイブ）として知られていることができます。これを行うには、パネルを右クリックし、「コンテンツ付きHARとして保存」を選択します。

JSONからデータを抽出し、好きなようにフィルタリングして集約できます。私はローカルファイルシステムからHARをロードし、データを解析し、内容をフィルタリングしてセッションに現れる一意のConnection IDの数を示す簡単なサンプルスクリプトを作成しました。

function loadFile(event) { 
 
    var file = event.target.files[0]; 
 

 
    if (file) { 
 
     var reader = new FileReader(); 
 
     reader.onload = function(e) { 
 
      var contents = e.target.result; 
 
      var data = JSON.parse(contents); 
 
      getUniqueConnectionCount(data); 
 
     } 
 
     reader.readAsText(file); 
 
    } else { 
 
     alert('Failed to load file.'); 
 
    } 
 
} 
 

 
function getUniqueConnectionCount(data) { 
 
    var entries = data.log.entries; 
 
    var uniqueConnectionIds = entries.map(function(item) { 
 
     return item['connection']; 
 
    }).filter(function(x, i, a) { 
 
     return a.indexOf(x) === i && i > 0; 
 
    }); 
 

 
    console.log('There were ', uniqueConnectionIds.length, ' unique connections found', uniqueConnectionIds); 
 
} 
 

 
document.getElementById('files').addEventListener('change', loadFile, false);

<div> 
 
    <input type='file' id='files' name='files' /> 
 
</div>

注：「ログを保持]を確認してくださいは、以前のセッションからのデータを見ることを避けるために解除されています。これはあなたのユースケースの簡単な例ですが、これを拡張してより一般的なものにすることができます。