欢迎来到CaoPorn - 超碰在线视频网,我们因为缘分而相聚。请记住我们的网址:kti.hf-jr.com。CaoPorn - 超碰在线视频网提供更多更好看的东东都在这里

诡异的 ERR_CONTENT_LENGTH_MISMATCH错误

来个引子

公司里有一个叫做 SPMS(SoftwareProcessManagementSystem)的系统, 其受众为咪咕的研发同学,里面有各种好用的功能,比如 任务管理、 业务需求管理、 权限申请管理以及 缺陷管理等等。这个系统目前只支持PC,但也有不少同学反应有时电脑不再身边,能否搞一个App?所以,基于各位同学的呼声,SPMS系统的App化就显得很必要了。我们现在的主要工作就是将其核心功能App化。

由于用原生技术来开发App比较麻烦,开发周期也较长,所以我们采用了HTML5的方式来开发,通过Nuxt.js来对Vue服务端渲染,然后通过WebView来远程载入移动网页。

突发事件

今天, Android开发组的同学突然给我们前端组报了一个Bug,说:

在测试环境上点击 返回按钮返回不了App主屏,但是生产环境却正常。

画外音: Android和iOS端将一个名为 deviceApi的原生对象注入到了WebView,前端这边只需用到调用 window.deviceApi.goBack()就可以返回主屏。

看到问题,我觉得蛮惊奇的,测试环境和生成环境的代码都是一样的,而且测试同学还测试过,怎么会有问题呢?于是马上打开浏览器,按下F12,控制台出现了如下的错误:

这是什么鬼? 貌似是 vendor.js文件下载失败了。 我直接在浏览器里面访问这个 vendor.js文件,浏览器竟然一直那里一脸苦逼的转圈等待; 我测试了下其他js文件,浏览器瞬间就将它们加载完毕了,这不科学!对比了下,发现 vendor.js只是比其他文件大100多KB而已。。。

开始分析

我想, 是不是Node.js那边出现了问题? 于是我登入到测试服务器, 运行如下命令:

  1. # 3000为Node.js服务端口, Nginx那边会by_pass到这个端口上

  2. wget http://127.0.0.1:3000/_nuxt/vendor_87d26.js

文件下载正常, 看来Node.js一切正常。 在测试下公网IP访问:

  1. wget http://39.156.1.71:16001/_nuxt/vendor_87d26.js

可以看到, wget在不停的尝试重新下载。于是想着Nginx应该有错误日志,然后在 error.log中看到这样的错误:

从图中可以看到,貌似遇到了权限问题。由于Nginx会对静态文件进行缓存,貌似没有读取缓存的权限,所以报错了。于是查看了下 /usr/local/nginx/proxy_temp的文件夹权限

从图中可以看到, proxy_cache的文件夹权限属于用户 usermg, nginx默认情况下启动的用户是 nobody, 所以一定会报错了。

解决方案

解决方法很简单, vim nginx.conf, 然后在首行增加如下代码即可:

  1. user  usermg users;

也许有同学问, 为什么之前没问题? 是这样的,之前我们的Linux系统都是root权限, nginx也是通过root启动的,权限非常高;但是这样会有风险,然后我们的运维同学就收回了root权限,但是忘记修改了 nginx.conf, 所以就出现了这样的问题。 生产环境上因为一切操作都很规范,所有没有这样的异常发生。所以,以后真的得要多注意呀!

还有同学会问,为什么浏览器会下载不下来这个 vendor.js文件。我是这样理解的, 因为nginx开启了gzip, 文件下是基于chunked的,也就是一块一块的下载,但是由于没有访问权限,所以浏览器会不停的尝试,所以等待时间会比较长。

总结

本片小文主要解决了一个比较怪异的 net::ERR_CONTENT_LENGTH_MISMATCH问题, 解决方式很简单,但是其中的解决过程却也值得我们思考。还有一些服务器操作规范的问题也需要引起大家的注意

本文也参考了这篇文章http://www.tonitech.com/2431.html,表示感谢!