Javascript not loading due to net::ERR_CONTENT_LENGTH_MISMATCH

Question

I've got an app that runs fine locally, but barfs in production. (Classic problem, right?)

In production, the JS isn't firing correctly. When I open up the browser console, I see this error:

net::ERR_CONTENT_LENGTH_MISMATCH

When I look in the network tab of Developer Tools, is shows that it failed on a GET request for text/html.

It's a cryptic error. I've only found two other SO posts that even mention is and they're unsolved. (For the interested: first post and second post)

Any idea (1) what it means or (2) how to resolve it?

Answer 1

I am getting Error: net::ERR_CONTENT_LENGTH_MISMATCH

Have a look at your server logs to determine what the real issue is.

For me the problem lay somewhere between nginx and file permissions:

• tail -f /usr/local/var/log/nginx/error.log or run nginx -t to determine your conf location, where you could specify a custom log path.
• refresh the asset in your browser, eg http://localhost:3000/assets/jquery/jquery.js

You may see something like this in the logs:

"/usr/local/var/run/nginx/proxy_temp/9/04/0000000049" failed (13: Permission denied) while reading upstream for file xyz

Heres how I fixed:

sudo nginx -s stop sudo rm -rf /usr/local/var/run/nginx/* sudo nginx 

Answer 2

According to this bug report, that error occurs when an external resource length does not match the Content-Length header given in the response.

This might occur because of a misconfigured server, or (as a stretch) maybe some BOM characters got put into the file, or maybe even different lines endings (are you writing on a DOS machine and deploying to a UNIX machine?) may cause issues.

Hope this helps.