返されたコンテンツにヘッダーContent-Type：text / htmlがある場合でも、Chrome開発ツールは応答を表示できません。charset = UTF-8

返されたコンテンツのタイプがtext / htmlの場合、Chrome開発者ツールが「応答データを表示できませんでした」と表示して応答するのはなぜですか？

開発者ツールで返された応答を確認する代替手段は何ですか？

これは、「ログの保持」がチェックされていて、別の場所に移動した後で前の要求の応答データを表示しようとした場合にのみ発生すると思います。

たとえば、このStack Overflow質問の読み込みに対する応答を表示しました。見れば分かります。

2回目は、このページを再読み込みしましたが、ヘッダーや応答は表示しませんでした。別のWebサイトに移動しました。応答を見ると、「応答データのロードに失敗しました」と表示されています。

これは既知の問題であり、しばらくの間使用されており、多くの議論が交わされています。ただし、回避策として、で一時停止するonunloadため、離れる前に応答を表示できるため、離れた場所に移動してもデータが失われません。

window.onunload = function() { debugger; }

JSONデータをリクエストしているときにエラーが発生する場合：

JSONデータをリクエストしている場合、JSONが大きすぎる可能性があり、そのためにエラーが発生します。

私の解決策は、リクエストリンクを新しいタブにコピーし（getブラウザからのリクエスト）、データをオンラインでJSONビューアにコピーし、そこで自動解析してそこで作業します。

Gideonによって説明されているように、これはChromeの既知の問題であり、5年以上オープンしていて、修正することに特に関心はありません。

残念ながら、私の場合、window.onunload = function() { debugger; }回避策も機能しませんでした。これまでのところ、私が見つけた最善の回避策は、ナビゲーションの後でさえ応答データを表示するFirefoxを使用することです。Firefox devtoolsには、Chromeにはない優れた機能が多数あります。たとえば、htmlの場合は応答データを強調表示し、JSONの場合は自動的に解析します。

Gideonが説明したように、これは既知の問題です。代わりに
使用しwindow.onunload = function() { debugger; }ます。
しかし、[ソース]タブでブレークポイントを追加すると、問題を解決できます。このような：

「応答データの表示に失敗しました」は、クロスドメインリクエストを実行していて、リモートホストがCORSヘッダーを適切に処理していない場合にも発生する可能性があります。jsコンソールでエラーを確認してください。

あなたがAJAX要求を行った場合fetch、それがで読んだ場合を除き、応答が示されていない.text()、.json()など、

あなただけの場合：

 r = fetch("/some-path");

レスポンスは開発ツールでは表示されません。
実行すると表示されます：

r.then(r => r.text())

大きなJSONデータをリクエストしているときにこのエラーを受け取った人にとっては、Blauhirnが述べたように、認証ヘッダーなどを使用している場合にリクエストを新しいタブで開くだけの解決策ではありません。

当然のことながら、Chromeには[コピー]-> [カールとしてコピー]などの他のオプションがあります。この呼び出しをコマンドラインからcURLを介して実行すると、元の呼び出しとまったく同じになります。

> ~/result.jsonコマンドの最後の部分に追加して、結果をファイルに保存しました。それ以外の場合は、コンソールに出力されます。