Chromeデベロッパーツールでリソースのstatus = canceledとはどういう意味ですか？

ページがキャンセルされる原因は何ですか？Chromeデベロッパーツールのスクリーンショットを持っています。

これは頻繁に発生しますが、毎回ではありません。他のリソースがキャッシュされると、ページを更新するとLeftPane.aspxが読み込まれるようです。そして、本当に奇妙なのは、これがInternet Explorer 8ではなく、Google Chromeでのみ発生することです。Chromeがリクエストをキャンセルする理由は何ですか？

Chromeがフレームまたはiframe内にあるものをロードするリクエストをキャンセルするという同様の問題と闘いましたが、断続的にしか発生せず、コンピューターやインターネット接続の速度に依存しているように見えました。

この情報は数か月前のものですが、Chromiumを最初から作成し、ソースを掘り下げて、リクエストがキャンセルされる可能性のあるすべての場所を見つけ、それらすべてにブレークポイントを設定してデバッグしました。メモリから、Chromeがリクエストをキャンセルする唯一の場所：

• 要求が行われる原因となったDOM要素が削除されました（つまり、IMGがロードされていますが、ロードが発生する前にIMGノードが削除されました）
• データのロードが不要になるような処理を行いました。（つまり、iframeのロードを開始し、srcを変更するか、内容を上書きします）
• 同じサーバーに送信されるリクエストが多数あり、以前のリクエストのネットワークの問題により、後続のリクエストが機能しないことが示されました（DNSルックアップエラー、以前の（同じ）リクエストの結果、たとえばHTTP 400エラーコードなど）

私たちのケースでは、最終的に、HTMLを別のフレームに追加しようとする1つのフレームまで追跡しました。これは、宛先フレームがロードされる前に発生することもありました。iframeのコンテンツに触れると、iframeにリソースを読み込むことができなくなり（どこに配置するかをどのように判断するのでしょうか）、要求をキャンセルします。

status = canceledは、JavaScriptイベントのajaxリクエストでも発生する可能性があります。

<script>
  $("#call_ajax").on("click", function(event){
     $.ajax({
        ...    
     });
  });
</script>

<button id="call_ajax">call</button> 

イベントはリクエストを正常に送信しますが、その後キャンセルされます（サーバーによって処理されます）。その理由は、同じクリックイベントでajaxリクエストを行っても、要素がクリックイベントでフォームを送信するためです。

リクエストがキャンセルされないようにするには、JavaScript event.preventDefault（）; 呼び出す必要があります：

<script>
  $("#call_ajax").on("click", function(event){
     event.preventDefault();
     $.ajax({
        ...    
     });
  });
</script>

注意：ラッピングフォーム要素がないことを確認してください。

onclick = {}が設定されたボタンがフォーム要素でラップされるという同様の問題がありました。ボタンをクリックするとフォームも送信され、それがすべてを台無しにしてしまいます...

この答えはおそらく誰にも読まれないでしょうが、私はそれを書いてみませんか:)

もう1つの注意点は、AdBlock拡張機能、または一般的な拡張機能です。

しかし、「たくさんの」人々がAdBlockを持っています...

拡張機能を除外するには、シークレットモードで新しいタブを開き、テストする拡張機能に対して「シークレットモードを許可」がオフになっていることを確認します。

「X-Frame-Options」ヘッダータグを確認することをお勧めします。SAMEORIGINまたはDENYに設定されている場合、iFrameの挿入は仕様に従ってChrome（およびその他のブラウザー）によってキャンセルされます。

また、一部のブラウザーはALLOW-FROM設定をサポートしていますが、Chromeはサポートしていません。

これを解決するには、「X-Frame-Options」ヘッダータグを削除する必要があります。これにより、クリックジャッキング攻撃を未然に防ぐことができるため、リスクとは何か、およびリスクを軽減する方法を決定する必要があります。

私の場合、jqueryのグローバルタイムアウト設定であり、jqueryプラグインがグローバルタイムアウトを500ミリ秒に設定しているため、リクエストが500ミリ秒を超えると、Chromeがリクエストをキャンセルします。

これが私に起こったことです：サーバーが302リダイレクトの不正な「Location」ヘッダーを返していました。もちろん、Chromeはこれを教えてくれませんでした。このページをFirefoxで開いたところ、すぐに問題が見つかりました。複数のツールがあるのは素晴らしい:)

この(canceled)ステータスに遭遇したもう1つの場所は、特定のTLS証明書の設定ミスです。などのサイトのhttps://www.example.com設定が誤っており、証明書にが含まれていないwww.がに対して有効である場合https://example.com、Chromeはこのリクエストをキャンセルし、自動的に後者のサイトにリダイレクトします。これはFirefoxには当てはまりません。

現在有効な例：https : //www.pthree.org/

iframe内の個別のドメインにあるセキュアページと非セキュアページの間でリダイレクトするときに、キャンセルされたリクエストが発生しました。リダイレクトされたリクエストは、「キャンセルされた」リクエストとして開発ツールに表示されました。

支払いゲートウェイでホストされているフォームを含むiframeのあるページがあります。iframe内のフォームが送信されると、支払いゲートウェイは私のサーバーのURLにリダイレクトされます。リダイレクトは最近動作を停止し、代わりに「キャンセルされた」リクエストとして終了しました。

Chrome（Windows 7 Chrome 30.0.1599.101を使用していた）では、iframe内のリダイレクトが別のドメインの安全でないページに移動することを許可しないようです。これを修正するために、iframe内のリダイレクトされたリクエストが常に安全なURLに送信されるようにしました。

iframeのみのより簡単なテストページを作成すると、コンソールに警告が表示されました（以前に見逃していたか、表示されなかった可能性があります）。

[Blocked] The page at https://mydomain.com/Payment/EnterDetails ran insecure content from http://mydomain.com/Payment/Success

PC、Mac、AndroidのChromeでは、リダイレクトがキャンセルされたリクエストになりました。それが私のウェブサイトのセットアップ（SagePay Low Profile）に固有のものか、Chromeで何かが変更されたかはわかりません。

Chromeのバージョン33.0.1750.154 m では、ローカルホストをポイントしたモバイルエミュレーションを使用している場合、画像のロードが常にキャンセルされます。特にユーザーエージェントのスプーフィングがオンの場合（画面の設定のみ）。

ユーザーエージェントのなりすましをオフにすると、画像リクエストはキャンセルされません、画像が表示されます。

理由はまだわかりません。前者の場合、要求がキャンセルされると、要求ヘッダー（注意：暫定ヘッダーが表示されます）には

• 受け入れる
• キャッシュ制御
• プラグマ
• リファラー
• ユーザーエージェント

後者の場合、それらすべてに加えて、次のような他の

• クッキー
• 接続
• ホスト
• Accept-Encoding
• 受け入れ言語

肩をすくめる

JavaScript経由でリダイレクトすると、Chromeでこのエラーが発生しました。

<script>
    window.location.href = "devhost:88/somepage";
</script>

ご覧のとおり、「http：//」を忘れました。追加した後、うまくいきました。

私の場合、クリックイベントのようなアンカーがありました

<a href="" onclick="somemethod($index, hour, $event)">

クリックイベント内で、ネットワークコールがあり、Chromeがリクエストをキャンセルしました。アンカーはしているhrefと""手段、それはページをリロードし、同じ時間は、それが取り消されますネットワークコールでイベントをクリックします。のhrefようにvoidで置き換えるたび

<a href="javascript:void(0)" onclick="somemethod($index, hour, $event)">

問題は解消しました！

リクエストがchromeによってキャンセルされた別の例を示します。これはちょうど今遭遇したもので、これまでの回答のいずれにもカバーされていません。

一言で言えば
、自分のAndroidフォンで自己署名証明書が信頼されていない。

詳細
開発/デバッグ段階です。URLは自己署名ホストを指しています。コードは次のようなものです：

location.href = 'https://some.host.com/some/path'

Chromeは静かにリクエストをキャンセルしました。私のようなWeb開発の初心者が問題を修正するための手がかりはありません。Androidフォンを使用して証明書をダウンロードしてインストールしたら、問題は解決しました。

Angular（2+）に組み込まれているようなObservableベースのHTTPリクエストを利用している場合、ObservableがキャンセルされたときにHTTPリクエストをキャンセルできます（RxJS 6 switchMapオペレーターを使用してストリームを結合している場合は一般的です） 。ほとんどの場合mergeMap、リクエストを完了させたい場合は、代わりにoperator を使用するだけで十分です。

私のメインのcssフォルダーの外にある別のフォルダーに保存されている2つのCSSファイルでまったく同じことがありました。私は式エンジンを使用していますが、問題はhtaccessファイルのルールにあることがわかりました。フォルダーを自分の条件の1つに追加しただけで修正されました。次に例を示します。

RewriteCond %{REQUEST_URI} !(images|css|js|new_folder|favicon.ico)

潜在的な競合がないかhtaccessファイルを確認することは価値があるかもしれません

スタイルシートにWebフォントを埋め込むと、すべてのタイプのフォントとwoff、woff2、ttfが埋め込まれます。最近、woff2が存在する場合、Chromeがttfおよびwoffへのリクエストをキャンセルすることに気付きました。現在Chromeバージョン66.0.3359.181を使用していますが、Chromeが追加のフォントタイプのキャンセルをいつ開始したかわかりません。

この問題<button>は、jsからajaxリクエストを送信するはずのフォームにタグがあったために発生しました。しかし、この要求は、ブラウザが原因でキャンセルされました。クリックすると、フォームが自動的に送信されますbutton、フォーム内を。

そのためbutton 、通常divまたはspanページ上ではなく実際に使用したい場合、およびフォームスローjsを送信したい場合は、preventDefault関数を使用してリスナーをセットアップする必要があります。

例えば

$('button').on('click', function(e){

    e.preventDefault();

    //do ajax
    $.ajax({

     ...
    });

})

を呼び出すときに私にも同じことが起こりました。$を含むjsファイル。ajax、そしてajaxリクエストを出します。私がしたことは通常通りです。

私の場合、メールクライアントウィンドウを表示するコードが原因で、Chromeは画像の読み込みを停止しました。

document.location.href = mailToLink;

$（function（）{...}）の代わりに$（window）.load（function（）{...}）に移動するのが役立ちました。

これにより、falseを省略したときにキャンセルステータスに遭遇した人を助けることができます。送信フォームで。これにより、ajax送信の直後に送信アクションが実行され、現在のページが上書きされました。以下にコードを示しますが、最後に重要なfalseが返されます。

$('form').submit(function() {

    $.validator.unobtrusive.parse($('form'));
    var data = $('form').serialize();
    data.__RequestVerificationToken = $('input[name=__RequestVerificationToken]').val();

    if ($('form').valid()) {
        $.ajax({
            url: this.action,
            type: 'POST',
            data: data,
            success: submitSuccess,
            fail: submitFailed
        });
    }
    return false;       //needed to stop default form submit action
});

それが誰かを助けることを願っています。

LoopbackJSから来て、チャートの例で提供されているようなカスタムストリームメソッドを使用しようとする人向け。私はを使用してこのエラーを取得していましたPersistedModelが、基本的にModel私の問題の修正に切り替えましたeventsourceステータスをキャンセルする。

繰り返しますが、これは特にループバックAPIを対象としています。そして、これはトップアンサーであり、グーグルのトップなので、私は答えの組み合わせでこれを投げると思いました。

私は同じ問題に直面していましたが、コードのどこかでこの疑似コードを使用していました：

• iframeを作成する

• iframeのonloadフォームを送信

• 2秒後、iframeを削除します

したがって、サーバーが応答を書き込んでいたiframeの応答にサーバーが2秒以上かかった場合は削除されましたが、応答はまだ書き込まれていましたが、書き込むiframeがなかったため、Chromeが要求をキャンセルしました。したがって、これを回避するために、応答が終わった後にのみiframeが削除されるようにしました。または、ターゲットを "_blank"に変更できます。したがって、理由の1つは、 書き込み中のリソース（私の場合はiframe）が、書き込みを停止する前に削除または削除されると、要求がキャンセルされることです。

私にとって「キャンセル」ステータスは、ファイルが存在しないためでした。Chromeが表示されないのはなぜですか404。

それは私にとって間違った道のように単純でした。デバッグの最初のステップは、ajaxなどとは独立してファイルをロードできるかどうかを確認することです。

リクエストは追跡保護プラグインによってブロックされた可能性があります。

300枚の画像を背景画像としてロードしたときに、私に起こりました。最初のタイムアウトが発生したか、残りがすべてキャンセルされたか、最大同時リクエスト数に達したと思います。一度に5つずつ実装する必要がある

その理由の1つとして、コードのどこかでXMLHttpRequest.abort（）が呼び出されたことが考えられcancelledます。この場合、リクエストはChromeデベロッパーツールの[ネットワーク]タブにステータスが表示されます。

私の場合、それはクロム76のアップデート後に来始めました。

JSコードの問題により、window.locationが複数回更新され、以前のリクエストがキャンセルされました。この問題は以前から存在していましたが、バージョン76への更新後にChromeがリクエストのキャンセルを開始しました。

レコードの更新時に同じ問題が発生しました。save（）の内部では、フォームから取得したrawデータを準備してデータベースのフォーマットと一致させ（enum値の多くのマッピングを行うなど）、これによりputリクエストが断続的にキャンセルされました。save（）からデータの準備を行い、それから専用のdataPrep（）メソッドを作成することで解決しました。私はこのdataPrepを非同期にして、メモリを大量に消費するすべてのデータ変換を待ちます。次に、準備したデータを、http putクライアントで使用できるsave（）メソッドに返します。putメソッドを呼び出す前に、dataPrep（）で待機することを確認しました。

await dataToUpdate = await dataPrep（）; http.put（apiUrl、dataToUpdate）;

これにより、リクエストの間欠的なキャンセルが解決されました。

あなたがaxiosを使用するなら、それはあなたを助けることができます

// change timeout delay: instance.defaults.timeout = 2500;

https://github.com/axios/axios#config-order-of-precedence