【Edge】リダイレクトされる前の元のURLを開発者ツールで確認する手順

ウェブサイトのアクセス時に意図せず別のページへリダイレクトされ、元のURLが分からなくなって困ることはありませんか。特にビジネスシーンでは、リダイレクト元の正確なURLを把握することが重要です。

Microsoft Edgeの「開発者ツール」を使えば、このようなリダイレクトが発生する前の元のURLを詳細に確認できます。

この記事では、Edgeの開発者ツールを活用し、リダイレクト元のURLを特定する具体的な手順を解説します。この情報をもとに、ウェブサイトの挙動分析やトラブルシューティングに役立ててください。

Edgeのリダイレクト確認機能と開発者ツールの役割

ウェブサイトのリダイレクトとは、アクセスしたURLから自動的に別のURLへ転送される仕組みのことです。これは、ページの移転やURLの変更、モバイルサイトへの誘導など、様々な目的で利用されます。リダイレクトには、主にHTTPリダイレクトとJavaScriptリダイレクトの二種類があります。

Edgeに搭載されている開発者ツールは、ウェブページの読み込みから表示までの全ての通信状況を詳細に可視化できる強力な機能です。このツールの中の「ネットワーク」タブを使用することで、HTTPリダイレクトの連鎖や、各リクエストのヘッダー情報、レスポンス内容などを詳細に確認できます。これにより、リダイレクトがどこから始まり、どのURLへ転送されたのか、そしてその転送元のURLが何であったのかを正確に把握することが可能になります。

この機能は、ウェブサイトのSEO分析、リンク切れの調査、不正なリダイレクトの検出、ウェブアプリケーションのデバッグなど、多岐にわたるビジネスシーンで非常に役立ちます。開発者ツールはWindows 11およびWindows 10のEdgeで標準で利用でき、特別な設定は不要です。

開発者ツールでリダイレクト元のURLを確認する手順

Edgeでリダイレクトされる前の元のURLを開発者ツールで確認する具体的な手順を説明します。この手順はWindows 11上のEdge最新版を基準としていますが、Windows 10のEdgeでも同様の操作で確認できます。

1. リダイレクトが発生するページを開く
   まず、リダイレクトが発生するウェブページをEdgeで開きます。リダイレクトが完了して転送先のページが表示された状態でも構いません。
2. 開発者ツールを起動する
   F12キーを押すか、Edgeの右上にある「設定など」メニュー
   (三点リーダーアイコン)をクリックし、「その他のツール」から「開発者ツール」を選択します。画面下部または横に開発者ツールパネルが表示されます。
3. 「ネットワーク」タブを選択する
   開発者ツールパネルの上部にあるタブの中から「ネットワーク」タブをクリックして選択します。このタブはウェブページの通信履歴を記録し表示する機能です。
4. 通信記録を開始しページを再読み込みする
   「ネットワーク」タブの左上にある赤い丸いボタンが有効(記録中)になっていることを確認します。もし無効な場合はクリックして有効にします。その後、リダイレクトが発生したページでCtrl+Rキーを押すか、ブラウザの更新ボタンをクリックしてページを再読み込みします。これにより、リダイレクトを含む全ての通信履歴が記録されます。
5. リダイレクト通信を特定する
   「ネットワーク」タブに表示された通信リストの中から、ステータスコードが「301」または「302」の項目を探します。これらのステータスコードはHTTPリダイレクトを示します。通常、転送元のURLがこのステータスコードを持つ項目として表示されます。
6. 元のURLの詳細を確認する
   特定した301または302の項目をクリックして選択します。右側に詳細パネルが表示されるので、「ヘッダー」タブをクリックします。
   
   「General」セクションの「Request URL」には、そのリクエストが最初に送られたURLが表示されます。これがリダイレクトされる前の元のURLです。
   
   また、「Response Headers」セクションの「Location」には、リダイレクト先のURLが記載されています。さらに、「Request Headers」セクションの「Referer」も、リクエストを送った元のページを示す場合があるので、合わせて確認するとよいでしょう。
7. 元のURLをコピーする
   「Request URL」に表示された元のURLを右クリックし、「値をコピー」を選択すると、クリップボードにURLがコピーされます。これにより、簡単に元のURLを記録したり、他のアプリケーションに貼り付けたりできます。

リダイレクト確認時の注意点とよくある誤操作

Edgeの開発者ツールでリダイレクト元のURLを確認する際に、知っておくべき注意点や、よくある誤操作について説明します。

キャッシュによる古いリダイレクト情報の表示

Edgeはウェブページの表示を高速化するため、キャッシュと呼ばれる一時データを保存しています。このキャッシュが原因で、リダイレクトのルールがすでに変更されているにもかかわらず、古いリダイレクト情報が表示されてしまうことがあります。特に、永続的なリダイレクトを示す301リダイレクトの場合、ブラウザが一度その情報を記憶すると、以降はサーバーに確認せずにキャッシュされたリダイレクト先へ直接移動することがあります。この状態では、開発者ツールを起動しても、本来のリダイレクトチェーンが正しく表示されない可能性があります。

対処法: 開発者ツールを開いた状態で、F5キーではなくCtrl+Shift+Rキーを押して「キャッシュをクリアしてハード再読み込み」を実行してください。これにより、キャッシュを無視してサーバーから最新の情報を取得し直すため、正確なリダイレクト情報を確認できます。また、Edgeの設定からブラウザのキャッシュを完全にクリアすることも有効です。

JavaScriptによるリダイレクトの特定が難しい

リダイレクトはHTTPステータスコードだけでなく、JavaScriptによっても行われることがあります。JavaScriptリダイレクトは、ウェブページの読み込みが完了した後にスクリプトが実行され、別のURLへ転送する仕組みです。この場合、ネットワークタブには通常のHTTPリダイレクトを示す301や302のステータスコードが表示されません。そのため、ネットワーク通信のログだけを見ていると、リダイレクト元の特定が難しいことがあります。

対処法: JavaScriptによるリダイレクトを疑う場合は、開発者ツールの「要素」タブでHTMLソースコードを確認し、JavaScriptのコードや<meta http-equiv="refresh">タグがないかを探します。また、「コンソール」タブでJavaScriptのエラーや警告メッセージを確認することも有効です。JavaScriptの実行状況を追跡するには、「ソース」タブでブレークポイントを設定し、スクリプトの実行を一時停止しながら確認する詳細なデバッグ手法が必要になる場合があります。

複数回のリダイレクトチェーンの追跡に手間がかかる

ウェブサイトによっては、複数のリダイレクトが連続して発生する「リダイレクトチェーン」が組まれていることがあります。例えば、「URL A」から「URL B」へリダイレクトされ、さらに「URL B」から「URL C」へリダイレクトされるといったケースです。この場合、開発者ツールのネットワークタブには複数の301または302の通信が記録されますが、どのリクエストがどのリダイレクトに対応しているのかを追跡するのが複雑になることがあります。

対処法: ネットワークタブの通信リストを上から順に確認し、各リクエストの「Location」ヘッダーと次のリクエストの「Request URL」を照らし合わせることで、リダイレクトの連鎖を追跡できます。特に、リダイレクト元のURLを特定したい場合は、最初のリダイレクトを示す301または302の通信項目を見つけ、その「Request URL」を確認することが最も重要です。また、ネットワークタブのフィルタリング機能を使って、特定のドメインやステータスコードで絞り込むと、目的の通信を見つけやすくなります。

HTTPリダイレクトとJavaScriptリダイレクトの比較

ウェブサイトのリダイレクトには主にHTTPリダイレクトとJavaScriptリダイレクトの二種類があります。それぞれの特徴と確認方法について比較します。

まとめ

この記事では、Edgeの開発者ツールを使ってリダイレクトされる前の元のURLを確認する手順を解説しました。

「ネットワーク」タブの通信履歴から301や302のステータスコードを持つリクエストを特定し、「ヘッダー」タブの「Request URL」を確認することで、正確なリダイレクト元を把握できます。これにより、ウェブサイトの挙動分析やトラブルシューティング、SEO関連の調査が効率的に進められるでしょう。

キャッシュのクリアやJavaScriptリダイレクトの確認方法といった注意点も踏まえ、Edgeの開発者ツールを多角的に活用してください。