What does status canceled for a resource mean in Chrome Developer Tools

Question

What would cause a page to be canceled  I have a screenshot of the Chrome Developer Tools     This happens often but not every time  It seems like once some other resources are cached  a page refresh will load the LeftPane aspx  And what s really odd is this only happens in Google Chrome  not Internet Explorer 8  Any ideas why Chrome would cancel a request

User · Answer

Here s what happened to me  the server was returning a malformed  Location  header for a 302 redirect  Chrome failed to tell me this  of course  I opened the page in firefox  and immediately discovered the problem  Nice to have multiple tools

User · Answer

NB  Make sure you don t have any wrapping form elements   I had a similar issue where my button with onclick    was wrapped in a form element  When clicking the button the form is also submitted  and that messed it all up     This answer will probably never be read by anyone  but I figured why not write it

User · Answer

In my case  it started coming after chrome 76 update   Due to some issue in my JS code  window location was getting updated multiple times which resulted in canceling previous request  Although the issue was present from before  chrome started cancelling request after update to version 76

User · Answer

Another place we ve encountered the  canceled  status is in a particular TLS certificate misconfiguration   If a site such as https   www example com is misconfigured such that the certificate does not include the www  but is valid for https   example com  chrome will cancel this request and automatically redirect to the latter site   This is not the case for Firefox   Currently valid example  https   www pthree org

User · Answer

In my case the code to show e-mail client window caused Chrome to stop loading images   document location href   mailToLink    moving it to   window  load function           instead of   function           helped

User · Answer

It was as simple as an incorrect path for me   I would suggest the first step in debugging would be to see if you can load the file independently of ajax etc

User · Answer

Content Security Policy headers for me  You can quickly rule out this possibility by checking the Chrome Dev Tools Console  if it s CSP problems there will be errors showing in the console  In  Net you can fix this either by adding headers in the web config file or in code   Refused to send form data to  https   www mysite mydomain   because it violates the following Content Security Policy directive   quot form-action  self    otherdomain www thirdparty co uk quot    Here s the web config fix for the above error   x000D   x000D   lt cspConfiguration gt           lt directives gt               lt directive name  form-action  allowedSources   self    mydomain gt               lt  directive gt           lt  directives gt   lt  cspConfiguration gt  x000D   x000D   x000D

User · Answer

I got this error in Chrome when I redirected via JavaScript    lt script gt      window location href    devhost 88 somepage    lt  script gt    As you see I forgot the  http      After I added it  it worked

User · Answer

One the reasons could be that the XMLHttpRequest abort   was called somewhere in the code  in this case  the request will have the cancelled status in the Chrome Developer tools Network tab

User · Answer

Here is another case of request being canceled by chrome  which I just encountered  which is not covered by any of answers up there   In a nutshell Self-signed certificate not being trusted on my android phone   Details We are in development debug phase  The url is pointing to a self-signed host  The code is like   location href    https   some host com some path    Chrome just canceled the request silently  leaving no clue for newbie to web development like myself to fix the issue  Once I downloaded and installed the certificate using the android phone the issue is gone

User · Answer

For my case  I had an anchor with click event like   lt a href    onclick  somemethod  index  hour   event   gt    Inside click event I had some network call  Chrome cancelling the request  The anchor has href with    means  it reloads the page and the same time it has click event with network call that gets cancelled  Whenever i replace the href with void like   lt a href  javascript void 0   onclick  somemethod  index  hour   event   gt    The problem went away

User · Answer

If you use axios it can help you     change timeout delay  instance defaults timeout   2500    https   github com axios axios config-order-of-precedence

User · Answer

The requests might have been blocked by a tracking protection plugin

User · Answer

happened to me the same when calling a  js file with    ajax  and make an ajax request  what I did was call normally

User · Answer

For anyone coming from LoopbackJS and attempting to use the custom stream method like provided in their chart example  I was getting this error using a PersistedModel  switching to a basic Model fixed my issue of the eventsource status cancelling out    Again  this is specifically for the loopback api  And since this is a top answer and top on google i figured i de throw this in the mix of answers

User · Answer

For me  canceled  status was because the file did not exist  Strange why chrome does not show 404

User · Answer

I had faced the same issue  somewhere deep in our code we had this pseudocode    create an iframe onload of iframe submit a form  After 2 seconds  remove the iframe   thus  when the server takes more than 2 seconds to respond the iframe to which the server was writing the response to  was removed  but the response was still to be written   but there was no iframe to write   thus chrome cancelled the request  thus to avoid this I made sure that the iframe is removed only after the response is over  or you can change the target to   blank   Thus one of the reason is  when the resource iframe in my case  that you are writing something in  is removed or deleted before you stop writing to it  the request will be cancelled

User · Answer

A cancelled request happened to me when redirecting between secure and non-secure pages on separate domains within an iframe   The redirected request showed in dev tools as a  cancelled  request   I have a page with an iframe containing a form hosted by my payment gateway  When the form in the iframe was submitted  the payment gateway would redirect back to a URL on my server   The redirect recently stopped working and ended up as a  cancelled  request instead    It seems that Chrome  I was using Windows 7 Chrome 30 0 1599 101  no longer allowed a redirect within the iframe to go to a non-secure page on a separate domain  To fix it  I just made sure any redirected requests in the iframe were always sent to secure URLs     When I created a simpler test page with only an iframe  there was a warning in the console  which I had previous missed or maybe didn t show up     Blocked  The page at https   mydomain com Payment EnterDetails ran insecure content from http   mydomain com Payment Success   The redirect turned into a cancelled request in Chrome on PC  Mac and Android  I don t know if it is specific to my website setup  SagePay Low Profile  or if something has changed in Chrome

User · Answer

We had this problem having tag  lt button gt  in the form  that was supposed to send ajax request from js  But this request was canceled  due to browser  that sends form automatically on any click on button inside the form   So if you realy want to use button  instead of regular div or span on the page  and you want to send form throw js - you should setup a listener with preventDefault function   e g      button   on  click   function e        e preventDefault           do ajax       ajax

User · Answer

Another thing to look out for could be the AdBlock extension  or extensions in general   But  a lot  of people have AdBlock      To rule out extension s  open a new tab in incognito making sure that  allow in incognito is off  for the extention s  you want to test

User · Answer

We fought a similar problem where Chrome was canceling requests to load things within frames or iframes  but only intermittently and it seemed dependent on the computer and or the speed of the internet connection   This information is a few months out of date  but I built Chromium from scratch  dug through the source to find all the places where requests could get cancelled  and slapped breakpoints on all of them to debug  From memory  the only places where Chrome will cancel a request    The DOM element that caused the request to be made got deleted  i e  an IMG is being loaded  but before the load happened  you deleted the IMG node  You did something that made loading the data unnecessary   i e  you started loading a iframe  then changed the src or overwrite the contents  There are lots of requests going to the same server  and a network problem on earlier requests showed that subsequent requests weren t going to work  DNS lookup error  earlier  same  request resulted e g  HTTP 400 error code  etc    In our case we finally traced it down to one frame trying to append HTML to another frame  that sometimes happened before the destination frame even loaded  Once you touch the contents of an iframe  it can no longer load the resource into it  how would it know where to put it   so it cancels the request

User · Answer

In my case  I found that it is jquery global timeout settings  a jquery plugin setup global timeout to 500ms  so that when the request exceed 500ms  chrome will cancel the request

User · Answer

status canceled may happen also on ajax requests on JavaScript events    lt script gt        call ajax   on  click   function event          ajax                                   lt  script gt    lt button id  call ajax  gt call lt  button gt     The event successfully sends the request  but is is canceled then  but processed by the server   The reason is  the  elements submit forms on click events  no matter if you make any ajax requests on the same click event   To prevent request from being cancelled  JavaScript event preventDefault    have to be called    lt script gt        call ajax   on  click   function event        event preventDefault           ajax                                   lt  script gt

User · Answer

If you make use of some Observable-based HTTP requests like those built-in in Angular  2    then the HTTP request can be canceled when observable gets canceled  common thing when you re using RxJS 6 switchMap operator to combine the streams   In most cases it s enough to use mergeMap operator instead  if you want the request to complete

User · Answer

In can this helps anybody I came across the cancelled status when I left out the return false  in the form submit  This caused the ajax send to be immediately followed by the submit action  which overwrote the current page  The code is shown below  with the important return false at the end      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       Hope that helps someone

User · Answer

I had an a tag inside a div tag  div had onclick  location  http   mydestination org    and a tag had the same URL in href  That caused the target page to be loaded two times and the first load was canceled by Chrome

User · Answer

I have embedded all types of font as well as woff  woff2  ttf when I embed a web font in style sheet  Recently I noticed that Chrome cancels request to ttf and woff when woff2 is present  I use Chrome version 66 0 3359 181 right now but I am not sure when Chrome started canceling of extra font types

User · Answer

It happened to me when loading 300 images as background images  I m guessing once first one timed out  it cancelled all the rest  or reached max concurrent request  need to implement a 5-at-a-time

User · Answer

Chrome Version 33 0 1750 154 m consistently cancels image loads if I am using the Mobile Emulation pointed at my localhost  specifically with User Agent spoofing on  vs  just Screen settings     When I turn User Agent spoofing off  image requests aren t canceled  I see the images   I still don t understand why  in the former case  where the request is cancelled the Request Headers  CAUTION  Provisional headers are shown  have only   Accept Cache-Control Pragma Referer User-Agent   In the latter case  all of those plus others like    Cookie Connection Host Accept-Encoding Accept-Language   Shrug

User · Answer

I had the exact same thing with two CSS files that were stored in another folder outside my main css folder  I m using Expression Engine and found that the issue was in the rules in my htaccess file  I just added the folder to one of my conditions and it fixed it  Here s an example   RewriteCond   REQUEST URI    images css js new folder favicon ico    So it might be worth you checking your htaccess file for any potential conflicts

User · Answer

I had the same issue when updating a record  Inside the save   i was prepping the rawdata taken from the form to match the database format  doing a lot of mapping of enums values  etc   and this intermittently cancels the put request  i resolved it by taking out the data prepping from the save   and creating a dedicated dataPrep   method out of it  I turned this dataPrep into async and await all the memory intensive data conversion  I then return the prepped data to the save   method that i could use in the http put client  I made sure i await on dataPrep   before calling the put method   await dataToUpdate   await dataPrep    http put apiUrl  dataToUpdate    This solved the intermittent cancelling of request

User · Answer

You might want to check the  X-Frame-Options  header tag   If its set to SAMEORIGIN or DENY then the iFrame insertion will be canceled by Chrome  and other browsers  per the spec   Also  note that some browsers support the ALLOW-FROM setting but Chrome does not   To resolve this  you will need to remove the  X-Frame-Options  header tag   This could leave you open to clickjacking attacks so you will need to decide what the risks are and how to mitigate them

User · Answer

In my case the cause of the problem was yet another one  My application is sitting behind a proxy  and Chrome requests were being sent with the If-Modified-Since HTTP header  When this header is present the exepcted behavior is   the server will send back the requested resource  with a 200 status  only if it has been last modified after the given date  If the request has not been modified since  the response will be a 304 without any body   The Proxy was failing to meet this expectation  responding with a 304 status code but a non-empty body  thus causing the request to be cancelled  After fixing the proxy behavior requests worked like a charm

[debugging] What does status=canceled for a resource mean in Chrome Developer Tools?

Examples related to debugging

Examples related to http

Examples related to google-chrome

Examples related to developer-tools

[debugging] What does status=canceled for a resource mean in Chrome Developer Tools?

Examples related to debugging

Examples related to http

Examples related to google-chrome

Examples related to developer-tools

Examples related to web-developer-toolbar