document.location.reload(true) canceled in chrome

Question

I have a function to check if results are on the server.

var d = document;
var dl = d.location;
var w = window;
var wt = w.setTimeout;
var X = XMLHttpRequest;
function _checkreload() {
    var x = new X();
    x.open('GET', '?test=results');
    x.onreadystatechange = function (c) {
        if (x.readyState === 4) {
            if (x.status == 205) {
                dl.reload(true);
            } else {
                wt(_checkreload, 200);
            }
        }
    };
    x.send();
};

_checkreload();

Sometimes the reload is canceled for unknown reason:

Question

How to find out for what reason the reload is canceled?

Details of the request

Because the request is canceled there are no informations in the details pane. Even if some bytes has been sent to the server (or even responsed from the server back to the browser), chrome does not display them.

How can you tell it's not the original page load being canceled? — charlietfl, Dec 23 '18 at 13:20
How can you tell it's not the AJAX call to `?test=results` that is being cancelled? Please click it and let us see the details of the cancelled request. — Anders Carstensen, Dec 23 '18 at 16:13
@AndersCarstensen **Because** Ready-State is 4 (Done) **and** the status is `205`! — Grim, Dec 23 '18 at 16:53
@kemicofa `window.location.reload(true)` is the same as `dl.reload(true)`, there is no difference — Grim, Jan 07 '19 at 12:05
This may be helpful: [What does status=canceled for a resource mean in Chrome Developer Tools?](https://stackoverflow.com/questions/12009423/what-does-status-canceled-for-a-resource-mean-in-chrome-developer-tools) — benvc, Jan 07 '19 at 17:53
what are the details of the canceled request? And if you can post more requests from network tab it will be helpful, it is not clear which localhost request has been canceled. — Munim Munna, Jan 08 '19 at 16:15
@MunimMunna Notice the updated question, unfortunately there are no details show up in chrome. — Grim, Jan 08 '19 at 17:38
There is no guarantee that errors do not refers to original page load being canceled as stated by @charlietfl. I did test with a fake API and there is no way to make it fail with your code. Instead breaking the page load returns exactly the same error in network console. — Mosè Raguzzini, Jan 10 '19 at 14:51
@PeterRader i found some notes on http://stackoverflow.com/a/13459106/216672 might help you.... — pramesh, Jan 13 '19 at 12:26

Frenchcooc · Answer 1 · 2019-01-09T20:13:14.410

0

try to add a try {} catch inside your _checkReload function. This will help you know what is the error, if it's on JS side.

var d = document;
var dl = d.location;
var w = window;
var wt = w.setTimeout;
var X = XMLHttpRequest;
function _checkreload() {
    try { // Add a try here...
        var x = new X();
        x.open('GET', '?test=results');
        x.onreadystatechange = function (c) {
            if (x.readyState === 4) {
                if (x.status == 205) {
                    dl.reload(true);
                } else {
                    wt(_checkreload, 200);
                }
            }
        };
        x.send();
    } catch (err) { console.log(err); } // ... and a catch there.
};

_checkreload();

As your function reloads the HTML page, I recommend you to enable the Preserve log feature on the chrome developer tools. This will helps a lot while debugging.

Last but not least, please note that if you are running this code from localhost, you may face CORS errors.

edited Jan 09 '19 at 20:13

answered Jan 09 '19 at 10:53

Frenchcooc

469
3
13

Reload has no return value, so we have now two kinds of return. 1. explicit `return` and 2. implicit-return. Therefore both violates the `only-one-return` codestyle. 2. If a error occourse it wil automatically print to console anyway. The direct use of console requires the browser to support the `console` feature and disables some older browsers, this reduces the compatibility to browsers. CORS is not a fact here because it requires the request to compleat and return a CORS error code successfull, but the request is canceled. (I have some more points but the comment-feature here is limited) – Grim Jan 09 '19 at 11:04
2

Edited. `return` was not in the code provided by @PeterRader – Frenchcooc Jan 09 '19 at 20:13

score 0 · Answer 2 · answered Jan 12 '19 at 01:39

Like some of the other comments are mentioning, it looks like your code is competing with loading all of the page assets.

To protect it you might need to wrap your function inside of an event listener for the load event of the window.

window.addEventListener('load', function(event){
    var d = document;
    var dl = d.location;
    var w = window;
    var wt = w.setTimeout;
    var X = XMLHttpRequest;
    function _checkreload() {
        var x = new X();
        x.open('GET', '?test=results');
        x.onreadystatechange = function (c) {
            if (x.readyState === 4) {
                if (x.status == 205) {
                    dl.reload(true);
                } else {
                    wt(_checkreload, 200);
                }
            }
        };
        x.send();
    };

    _checkreload();
});

If the timing every 200 ms is critical for this, you could set an event listener for loadstart and loadend of the window with timestamps for each. The difference between the events is your offset for the initialsetTimeout.

document.location.reload(true) canceled in chrome

Question

Details of the request

2 Answers2