Redirection on IE 11 = SCRIPT7002: XMLHttpRequest: Network Error 0x800c0008, The download of the specified resource has failed.

marcelo-lopes

Hi all,

I've spent a few hours trying to figure out why the redirection is not working on IE 11/Microsoft Edge, but I'm running out of ideas, maybe someone else can have some clues.

I'm using the suggested code for a redirection on my hook:

"hook": "filter:category.get", "method": "redirectIfMissingBadge"

....
               return callback({
                    status: 302,
                    path: '/some-path'
                });

It works well on all browsers except IE11, where I get the following error on console:

SCRIPT7002: XMLHttpRequest: Network Error 0x800c0008, The download of the specified resource has failed.

You can have more details here: https://gyazo.com/b4861e0b595394d1929d9f84219eac74

As you can see, ajaxify.loadData is getting the folowing error:

error {"readyState":0,"status":0,"statusText":"error"} textStatus "error" errorThrown NaN

instead of the 302 status.

I've even debug jquery ajax method and we can see by the logs that

transport.send( requestHeaders, done );

is returning
responses = undefined
status = 0
no nativeStatusText
headers = undefined

So bottom line, I can't use the redirection.
Have you the same issue when using this redirection?
Is there another way to redirect?
Does someone have a running app that the redirection works well even on IE11/Microsoft Edge?

Thank you

PitaJ

@marcelo-lopes can you provide a little more context for that code? Also, does that redirection work in any browser?

marcelo-lopes

Hi @PitaJ
turns out to be an issue with jquery.ajax on Microsoft Edge.
It works on latest Firefox and Chrome.

I've created an isolated exemple here with pure jquery and expressjs:
https://github.com/marcelo-lopes/jquery-ajax-302-issue

So I will have to change my plugin to not use the redirection suggested here:
https://community.nodebb.org/topic/3590/redirection-to-route-in-plugin/3

Does anyone is facing the same issue with the redirect on Edge?
I'm surprising that i'm the only one that found this

Thanks

PitaJ

@marcelo-lopes yeah it appears that 302 is broken on IE. Um still not sure how the code you provided here works though. Can you provide more context?

It looks like you're providing an object in the place an error should go. Is there some special handling of error.path or something that I don't know about?

You could probably try using filter:category.build instead which would give you direct access to the response object, where you could then do res.send("/category/456/") on API responses which tells ajaxify to redirect there. On normal responses just send a 302 redirect. I think you can detect if it's an API request by checking req.url but there may be an easier way.

marcelo-lopes

Hi @PitaJ thanks for the reply.

I was just replying with more context.
I built this plugin:
https://github.com/marcelo-lopes/nodebb-plugin-reproduce-redirection-issue
where you can easily reproduce the issue with a minimal code.

The object in place of the error is the solution implemented by @psychobunny . See this post please: https://community.nodebb.org/topic/3590/redirection-to-route-in-plugin/3

We call callback with the following object:

callback({
    status: 302,
    path: '/success'
});

and then, on \NodeBB\src\controllers\index.js method Controllers.handleErrors this code will handle this:

if (parseInt(err.status, 10) === 302 && err.path) {
	return res.locals.isAPI ? res.status(302).json(err.path) : res.redirect(err.path);
}

Then on \NodeBB\public\src\ajaxify.js on method onAjaxError there is this code to handle the redirection:

} else if (status === 302 || status === 308) {
	if (data.responseJSON && data.responseJSON.external) {
		window.location.href = data.responseJSON.external;
	} else if (typeof data.responseJSON === 'string') {
		ajaxifyTimer = undefined;
		ajaxify.go(data.responseJSON.slice(1), callback, quiet);
	}
}

It works well, except on IE11 and Microsoft Edge.

Is this information helpful?

I'll check your suggestion for filter:category.build. Thanks

PitaJ

@marcelo-lopes it looks like what you're doing should work. Maybe try changing from 302 to 308?

marcelo-lopes

@PitaJ unfortunately 308 doesn't work since Controllers.handleErrors doesn't handle this status.

After googling about this, the patch I ended up using is to use status code 333 instead of 302. So on \NodeBB\src\controllers\index.js:

if ((parseInt(err.status, 10) === 302 || parseInt(err.status, 10) === 333) && err.path) {
	return res.locals.isAPI ? res.status(333).json(err.path) : res.redirect(err.path);
	}

and on \NodeBB\public\src\ajaxify.js:

} else if (status === 302 || status === 308 || status == 333) {

and finally in my plugin:

callback({
    status: 333,
    path: '/chose-badge'
});

So now it works, but I had to change nodeBB core files

Should this be fixed on nodeBB core? since this issue can impact other nodeBB users...
What fix do you propose?

BTW, about your suggestion on filter:category.build, I may be missing something, but I can't see this hook anywhere.

Thanks again

PitaJ

@marcelo-lopes yeah, do you mind opening an issue about adding 308 to the core error handling?

As for filter:category.build, filter:***.build is a special hook fired for every request. The name is based on the template name.

marcelo-lopes

done:
https://github.com/NodeBB/NodeBB/issues/5561

Thank you @PitaJ

marcelo-lopes

Thanks @PitaJ. Have a great week.