Node.js expresses static server on Chrome-only images

Question

This is a really strange mistake that has bothered me for ages. I have a basic website that uses Express Static middleware in addition to the individual routes that Jade displays.

Here is my configuration

app.set('views', __dirname + '/views'); app.set('view engine', 'jade'); app.use(stylus.middleware({ src : __dirname + '/public', dest : __dirname + '/public', compile : function(str, path) { return stylus(str) .set('filename', path) .set('compress', true) .use(nib()) } })); app.use(bodyParser.urlencoded({ extended: false })) app.use(bodyParser.json()) app.use(cookieParser()) app.use(session({ secret: conf.sessionSecret, store: new RedisStore(), saveUninitialized: true, resave: true })); app.use(express.static(__dirname + '/public')) 

Here is my problem. After 5 updates on one tab in Chrome, image files refuse to download. All other content is fine, just images and only in Chrome. To fix this, you need to open a new tab. I also tested this in Firefox - no problem. This error does not just happen in this application - it happened in many of my others.

Since this project is currently under development, I would prefer not to bring it online as an example. Be sure this is fully reproducible. Any ideas?

UPDATE: I upgraded to Express 4 with a slight chance that an update could fix my problem. This is not true. You can see the screen I made from here .

UPDATE: to check if there was a problem with the static server, I changed my code like this:

 app.get('/img/*', function (req,res) { console.log(req.url); console.log(path.extname(req.url)); if (imgExt.indexOf(path.extname(req.url)) != -1) { res.sendfile('./public/'+req.url); } }); app.use(express.static(__dirname + '/public')) 

This had no effect, so I think this problem is either a client or a bug with Chrome.

Answer 1

After hours after debugging, I discovered this old code code buried on my servers.

 app.get('/favicon.ico', function (req, res) { res.writeHead(200, {'Content-Type': 'image/x-icon'} ); }); 

It was supposed to prevent double requests for the icon with an older version of Express. Obviously, I forgot to call res.end () at the end. In my opinion, neither Firefox nor Internet Explorer support this connection between updates, while Chrome did it. I appreciate the dialogue of all!

Answer 2

I believe that this is a chrome bug based on the fact that it is only in chrome (and not in firefox).

To fix this, I would try:

• Try Chrome Canary

• Timeout Decrease:

  server.on ('connection', function (socket) {console.log ("The new connection was made by the client"); socket.setTimeout (30 * 1000);})

Answer 3

This may also help:

I have a mixed folder with html5 images and videos that I installed for maintenance. These were videos that made all requests freeze as serve-static decompresses the entire file.

To prevent this problem, I had to send the video separately using middleware before installing the folder.

Hope this helps someone too.