Web

閲覧しているウェブページで利用されている HTTP のバージョンを確認する方法

投稿日:2019年2月18日 更新日:

ウェブブラウザで ウェブサイトを閲覧している際、HTTP のどのバージョンが使われているのか確かめる方法を紹介します。

Chrome の場合

(1) ウィンドウ右上の [設定]アイコン – [その他のツール] – [デベロッパーツール] を選択します。

デベロッパーツールを開きます
デベロッパーツールを開きます

(2) [Network]タブを開きます。

(3) 目的のウェブサイトにアクセスします。

(4) [Network]タブ内の [Protocol] の列に HTTP のバージョンが表示されます。

  • h2 と表示された場合は、HTTP/2
  • http/1.1 と表示された場合は、HTTP/1.1 を表します。
HTTP/2
HTTP/2
HTTP/1.1
HTTP/1.1

Protocol 列がない場合

Protocol 列がない場合は、以下のようにして表示させることができます。

もう一つの見分け方

[Network]タブに表示されたデータ(行)のどれかをクリックすると、右側に詳細が表示されます。
[Headers]タブ – [Request Headers] のところに、:method::path: といったコロンで囲まれたヘッダがある場合は、HTTP/2 です。

HTTP/1.1 の場合は、以下のようにこれらのヘッダフィールドがありません。

Firefox

(1) ウィンドウ右上にある [設定]アイコン – [ウェブ開発] – [ネットワーク] を選択します。

[ウェブ開発] - [ネットワーク] を選択します
[ウェブ開発] – [ネットワーク] を選択します

(2) 以下のように、列タイトルのあたりを右クリックして「プロトコル」にチェックを入れます。

「プロトコル」列が表示されます。

「プロトコル」列を追加します
「プロトコル」列を追加します

(3) 目的のウェブサイトにアクセスします。

(4) [ネットワーク]タブ内の [プロトコル] の列に HTTP のバージョンが表示されます。

[プロトコル] の列
[プロトコル] の列

(おまけ) [ネットワーク]タブ内に表示された項目(行)のどれかをクリックすると、右側に詳細情報が表示されます。この中の[ヘッダ]タブ内に「バージョン」が表示されます。

[ヘッダ]タブ内の「バージョン」
[ヘッダ]タブ内の「バージョン」

Edge

(1) ウィンドウ右上にある [設定]アイコン – [開発者ツール] を選択します。

[開発者ツール]
[開発者ツール]

(2) 開発者ツールの中の [ネットワーク]タブを開いておきます。

(3) 目的のウェブサイトにアクセスします。

(4) [ネットワーク]タブ内の [プロトコル] の列に HTTP のバージョンが表示されます。

[プロトコル] の列(HTTP/2)
[プロトコル] の列(HTTP/2)
[プロトコル] の列(HTTP/1.1)
[プロトコル] の列(HTTP/1.1)

📂-Web

執筆者:labo


comment

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

関連記事

Web

AMP for WordPress プラグインを利用した AMP対応をやめる方法

AMP for WordPress プラグインを使って WordPressサイトをAMP対応する手順 では、AMP for WordPress プラグインの利用方法について説明しましたが、今回のその逆 …

Web Programming

Webプログラミングのための Web入門

この記事では、Webプログラミングで必要になる Webの知識をご紹介します。 目次1. インターネット2. インターネットを土台として存在するプロトコル3. Web とは?4. URL5. HTML2 …

Chrome

Google Chrome 68 で、HTTPS非対応のマークが変わりました

目次1. Chrome 68 がリリース2. 以前のマーク3. Chrome 68 以降のマーク4. ついでに、https にしてアクセスしてみる5. おわりに 1. Chrome 68 がリリース …

Web

cron-job.org を利用して特定のURLに定期的にアクセスさせる

cron-job.org というサービスの利用手順について説明します。

Web

Icons8 の Free Icons を使う手順

Icons8 の Free Icons Icons8 というサイトでは、いろいろな種類の無料素材が提供されています。 今回、そのうちの1つである「アイコン(Free Icons)」を使う手順についての …