Search code examples
node.jsimagemagickgraphicsmagick

Response not ending and browser keeps loading - nodejs and graphicsmagick

I am new to nodejs. I am using graphicsmagick to resize the image before sending it to the browser. My code looks like this (res is the response to be sent from function(req,res){...}) -

imageURLPromise
.then(function(response) {
    var  body = response.body;
    if (body) {
    console.log("Found From: " + response.request.uri.href);

    //set response headers here
    setResponseData(res, response);


    var buf = new Buffer(body, "binary");
    console.log(buf);
    //gm module
    gm(buf).resize(400,300).toBuffer(function(err,buffer) {
        console.log("buffer here");
        res.end(buffer, "binary");
    });
    }
}, function(error) {
      console.log(error);
});

I get the image in the browser, I get the log "buffer here" but the browser stays in the "loading" state.

I have tried using .stream() with gm and pipe the stdout to response but it has the same problem.

If I do away with gm and directly write body to the response like this

res.end(body, 'binary');

then it works correctly.

Can someone tell what I am doing wrong here?

Solution

  • I figured out the problem. The problem was not with node or gm but with the HTTP response headers.

    When GM returns a buffer and we write that to the HTTP response then it sets the Transfer-Encoding header to "chunked". In that case the Content-Length header should never be set. You can read more about it here http://en.wikipedia.org/wiki/Chunked_transfer_encoding

    Since I was setting both the browser kept waiting for content even after the image had been sent.

    The code is exactly the same as I posted, except for the fact that in the setResponseData() function (which basically used to set headers) I am not setting the content-length header now.