Find out where Jquery ajax request gets redirected to.

Question

So- I've got this ajax request, see-. Blonde, about 6 feet tall, looks like this:

$.ajax({
    url: 'http://example.com/makeThing',
    dataType: 'html',
    type: 'POST',
    data: {
        something:someotherthing
    },
    complete: function(request, status) {
        console.log("headers=" + request.getAllResponseHeaders(););
    }
});

What happens is that the request to '/makeThing' returns a 302 redirect to a second url:'getThing/abc123'. All I want to do is find out what that second url is (programmatically- it'll be different every time, so just checking in firebug doesn't help me). I've tried plumbing the response headers that come back to the 'complete' callback, but that just gives me what came back on the second request.

Constraints: -I have no control over the server this is running on- just the js. -Can switch frameworks if I have to (dojo? prototype?)

Ideally, I'd do some sort of header-only request to /makeThing to find out what the redirect url is by getting just the headers of the initial 302 response.

Failing that (since jquery auto-follows redirects and doesn't seem to have a way to step in between the requests), I get retrieve the final response and use it to somehow get the url from... something? The request object, maybe?

TLDR: Sending an ajax request. Framework auto-follows the resulting 302 redirect. How do I figure out where it redirected to?

EDIT, Clarification: The final url will be different every time- calling 'makeThing' causes the server to create what is thereafter hosted at 'getThing/abc123'

Answer 1

Why don't you just plug the URL 'http://example.com/makeThing' into your browser and see where you end up?

Answer 2

If you boot up firebug, then open the console, you can follow where the request is actually going. When you see the AJAX request has finished processing, expand that console item and you'll see the requests involved and any response headers.

Answer 3

If possible, have your server set a header on those pages (the destination pages, not the redirecting one), for example set a "current-location" header, then you can do this:

$.ajax({
    url: 'http://example.com/makeThing',
    dataType: 'html',
    type: 'POST',
    data: {
        something:someotherthing
    },
    complete: function(request, status) {
        var location = request.getResponseHeader("current-location");
    }
});

Yes, this is a bit hacky, but since the redirect is handled internally in the XmlHttpRequest object (an event to which you can't access), you don't have much choice.

You can check the spec, this is the intended behavior for XmlHttpRequest:

If the origin of the URL conveyed by the Location header is same origin with the XMLHttpRequest origin and the redirect does not violate infinite loop precautions, transparently follow the redirect while observing the same-origin request event rules.