I've written a simple Node.js app that streams content (primarily for videos, but other stuff works too). It seems to work fine except with some jpegs, where the bottom of the image is not always displayed.
Here's an example, with the bottom portion of the picture missing on the left.
A site showing the problem is here and an identical-looking site without the problem is here. (There should be pink bits at the bottom of most images with the first link.)
The code for the app is on Github, but I guess the important lines are
stream = fs.createReadStream(info.file, { flags: "r", start: info.start, end: info.end });
stream.pipe(res);
(So all of the heavy lifting is done by stream.js, not my code.)
process.stdout
instead and save the output to a file, the whole image is shown.stdout
and the original are identical.Browser tests (over 3 computers & 1 VM)
I really have no idea what's going on here. I thought it could be a weird graphics driver bug, but the behaviour is consistent across all computers I've tried. I find it hard to blame Node.js / my code for this as it does seem to be transferring the whole of the file, but then it works fine without it.
Happy to supply more details if needed.
* Obviously I haven't tried every possible file type, but pngs, progressive jpegs, text and videos seem to work.
It turns out that the problem was the file size sent in the header (header["Content-Length"]
). I'd set this to info.end - info.start
, whereas the actual size is 1 more than that. Some browsers didn't like this and missed off the end of the picture when displaying it on screen. Oops.