jquery: how to handle a redirect

Question

I have the following scenario: - a simple html page with a form and some "fields" - when the form is submitted it is performed a GET to a specified URL that replies "302" and the url where the user has to be redirected too is in "Location" header - i checked with fiddler and evetything seems correct

The simple html page includes this piece of code:

function doSubmit() {
    var _url = $("#url").val();
    $.ajax({
        url: _url,
        complete: function(xmlHttp) {
            // xmlHttp is a XMLHttpRquest object
            alert(xmlHttp.status);
 }

The problem is that when submitting the request, i receive as statuscode: 0 and i'm not able to retrieve any "Location" header.

UPDATE

I tried using the Fetch API but it seems it doesn't work:

var req = new Request(url, {
    method: 'get',
    redirect: 'manual',
    "Cache-Control": "no-cache"
});
fetch(req).then(function (res) {
    alert(res.status);
}, function (e) {
    alert('error');
});

It always ends into an error.

You're not closing your AJAX request (or it's complete function. You need both `}` and `});` after the alert. Not sure if that's why the call isn't working though. — Obsidian Age, Jan 26 '17 at 22:00
I don't quite understand the question. Ajax requests silently follow redirects, so you don't have control over it in JavaScript. As result of the ajax request you will get data sent from last redirected URL (http://stackoverflow.com/questions/282429/returning-redirect-as-response-to-xhr-request/2573589#2573589) — Rafael, Jan 26 '17 at 22:03
@ObsidianAge: i didn't copy / paste all the code but i have the final `})` — Stefano D'Urso, Jan 27 '17 at 05:17
@Rafael: the goal would be to not to automatically follow redirect but it seems that it's not possible; anyway what i'm receiving as status code when i enter an url that will reply with a redirect, is "0" so i cannot either retrieve a successful reply — Stefano D'Urso, Jan 27 '17 at 05:22

Rafael · Accepted Answer · 2017-02-02T09:08:03.020

2

Standard ajax requests silently follow redirects and there is no way to stop the browser from doing it.

As alternative to ajax, there is a new Fetch API being developed, which allows manual redirect handling. You need to check if the current browser support is enough for your needs.

The problem with fetch API is, that due to security reasons (preventing data leaks), in case of redirect, the response object is filtered and has status 0. So, basically the only information left is the response.type with the value opaqueredirect. Please see spec draft. In other words, you're allowed to block redirects, but don't have access to the information from the redirect response, unless I missed something.

So, it seams that the answer to your questions is - it's not currently possible to implement full manual redirect handling, including reading the redirect URL from the redirect response.

edited Feb 02 '17 at 09:08

answered Jan 27 '17 at 07:56

Rafael

18,349
5
58
67

Unfortunately it's not working with FetchAPI (my browser support them); i updated the code above with the FetchAPI call. With Fiddler i can see that there's actually the correct reply "302" but that's not what i find with the code above. – Stefano D'Urso Jan 28 '17 at 17:41
@StefanoD'Urso I checked the Fetch API details and updated my answer accordingly. It turned out that due to security/privacy reasons the fetch API is limited in functionality for redirect responses. – Rafael Feb 02 '17 at 09:09
I have confirmed that Fetch API can not get the location header value or the url that redirected to without send the second http request. – bronze man Jul 17 '23 at 05:33

jquery: how to handle a redirect

1 Answers1