ネットワーク条件: ユーザー エージェント文字列をオーバーライドする

Dale St. Marthe
Dale St. Marthe

概要

[ネットワーク状態] パネルを使用して、ユーザー エージェント文字列をオーバーライドし、さまざまなネットワーク速度をエミュレートします。

ユーザー エージェント文字列をオーバーライドすると、ブラウザがウェブサーバーに自己を識別する方法が変更されます。つまり、ブラウザは以前のバージョンや別のブラウザを完全にシミュレートできます。これは、レスポンシブ デザイン、互換性、機能検出のテストに役立ちます。

ユーザー エージェント文字列をオーバーライドしても、Chrome ブラウザの内部動作は変更されず、Chrome に配信されるコンテンツが変更されます。

[ネットワーク状態] パネルを開く

[ネットワーク] パネルから [ネットワーク状態] パネルを開くか、DevTools で手動で開きます。

[ネットワーク] パネルを使用して [ネットワークの状態] パネルを開く手順は次のとおりです。

  1. DevTools を開きます
  2. [ネットワーク] パネルに移動します。
  3. [その他のネットワーク状態] ボタンをクリックして、[ネットワーク状態] パネルを開きます。
[その他のネットワーク状態] ボタンがハイライト表示され、[ネットワーク状態] パネルが開いています。
図 1[ネットワーク] パネルと [ネットワーク状態] パネル

[ネットワーク状態] パネルを手動で開くには:

  1. DevTools を開きます
  2. 以下のボタンを押してコマンド メニューを開きます。

    • macOS: Command+Shift+P
    • Windows、Linux、ChromeOS: Ctrl+Shift+P
      「ネットワークの状態」と入力されたコマンド メニュー。
      図 2。コマンド メニュー
  3. Network conditions」と入力し、[ネットワーク状態を表示] を選択して Enter キーを押します。DevTools ウィンドウの下部に [ネットワーク状態] パネルが表示されます。

または、右上の [その他のオプション] > [その他のツール] > [ネットワーク状況] を選択します。

ユーザー エージェント文字列をオーバーライドする

[ネットワーク状況] パネルでユーザー エージェント文字列をオーバーライドする手順は次のとおりです。

  1. [ネットワーク状態] パネルを開きます。
  2. [ユーザー エージェント] セクションで、[ブラウザのデフォルトを使用] チェックボックスをオフにします。

    [ブラウザのデフォルトを使用] を無効にする。
    図 3. [ブラウザのデフォルトを使用] を無効にする
  3. リストからユーザー エージェント文字列を選択するか、独自のカスタム文字列を入力します。

  4. ページを更新して結果を表示します。

ユーザー エージェント クライアントのヒントを編集する

[ネットワーク状況] パネルでは、選択したユーザー エージェント文字列のユーザー エージェント クライアントのヒントをカスタマイズできます。

この機能を使用する手順は次のとおりです。

  1. リストからユーザー エージェント文字列を選択するか、独自のカスタム文字列を入力します。
  2. [ユーザー エージェント クライアントのヒント] プルダウンをクリックします。関連する値が自動的に入力されたフォームが表示されます。

    User-Agent Client Hints フォーム。
    図 4. User-Agent Client Hints フォーム
  3. フォームを編集するには、[] をクリックして項目を削除し、[ブランドを追加] をクリックして [ユーザー エージェント] リストと [完全なバージョン] リストに追加します。

  4. 完了したら、フォームの下部にある [更新] ボタンをクリックします。

  5. ページを更新して結果を表示します。

ネットワーク速度を抑制する

[ネットワーク状態] パネルでネットワーク速度をスロットリングするには、[ネットワークのスロットリング] リストをクリックし、[高速 3G]、[低速 3G]、または [オフライン] を選択します。

[ネットワーク状態] パネルの [ネットワーク スロットリング] プルダウン。
図 5. [ネットワーク状態] パネルのネットワーク スロットリング リスト

また、[ネットワーク] パネルで、同様の方法でネットワーク速度をスロットリングすることもできます。[ネットワーク] パネルを開き、アクションバーの [スロットリング リスト] から目的の速度を選択します。

[ネットワーク] パネルの [ネットワーク スロットリング] プルダウン。
図 6. [ネットワーク] パネルのネットワーク スロットリング リスト

[パフォーマンス] パネルを使用してネットワーク速度をスロットリングすることもできます。[パフォーマンス] パネルを開き、[] をクリックして、[ネットワーク] リストから [高速 3G] または [低速 3G] を選択します。

[パフォーマンス] パネルの [ネットワーク スロットリング] プルダウン
図 7[パフォーマンス] パネルのネットワーク スロットリング リスト

ネットワーク スロットリング プロファイルを作成して、独自のカスタム ネットワーク スロットリング パラメータを設定します。方法については、スロットル処理をご覧ください。