Redirect to servlet fails

Question

I have a servlet named EditPhotos which, believe it or not, is used for editing the photos associated with a certain item on a web design I am developing. The URL path to edit a photo is [[SITEROOT]]/EditPhotos/[[ITEMNAME]].

When you go to this path (GET), the page loads fine. You can then click on a 'delete' link that POSTs to the same page, telling it to delete the photo. The servlet receives this delete command properly and successfully deletes the photo. It then sends a redirect back to the first page (GET).

For some reason, this redirect fails. I don't know how or why, but using the HTTPFox plugin for firefox, I see that the POST request receives 0 bytes in response and has the code NS_BINDING_ABORTED.

The code I am using to send the redirect, is the same code I have used throughout the website to send redirects:

response.sendRedirect(Constants.SITE_ROOT + "EditPhotos/" + itemURL);

I have checked the final URL that the redirect sends, and it is definitely correct, but the browser never receives the redirect. Why?

Answer 1

Read the server logs. Do you see IllegalStateException: response already committed with the sendRedirect() call in the trace?

If so, then that means that the redirect failed because the response headers are already been sent. Ensure that you aren't touching the HttpServletResponse at all before calling the sendRedirect(). A redirect namely exist of basically a Location response header with the new URL as value.

If not, then you're probably handling the request using JavaScript which in turn failed to handle the new location.

If neither is the case or you still cannot figure it, then we'd be interested in the smallest possible copy'n'pasteable code snippet which reproduces exactly this problem. Update then your question to include it.

---

Update as per the comments, the culprit is indeed in JavaScript. A redirect on a XMLHttpRequest POST isn't going to work. Are you using homegrown XMLHttpRequest functions or a library around it like as jQuery? If jQuery, please read this question carefully. It boils down to that you need to return a specific response and then let JS/jQuery do the new window.location itself.

Answer 2

Turns out that it was the JavaScript I was using to send the POST that was the problem. I originally had this:

<a href="#" onClick="javascript:deletePhoto(781)">Delete</a>

And everything got fixed when I changed it to this:

<a href="#" onClick="javascript:deletePhoto(781); return false;">Delete</a>

The deletePhoto function is:

function deletePhoto(photoID) {
    doPost(document.URL, {'action':'delete', 'id':photoID});
}

function doPost(path, params) {
    var form = document.createElement("form");
    form.setAttribute("method", "POST");
    form.setAttribute("action", path);
    for(var key in params) {
        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", key);
        hiddenField.setAttribute("value", params[key]);
        form.appendChild(hiddenField);
    }
    document.body.appendChild(form);
    form.submit();
}