2017年经历的那些灵异事件
2017年快要过去了,回顾这一年来,在业务代码里,开发新功能占据70%,修复BUG占了30%,在解决的这些BUG中,大部分都是代码级别的错误,使用 Chrome Devtools
基本都可以解决,但其中有三个比较神奇,算得上是灵异事件了。
鬼打墙
有一次后端同学重构了一下 DSP
广告平台的接口,让 Java
服务化提供接口, PHP
做 web
控制层掌管路由和透传接口,于是对之前的接口URL重新规划统一了一下,内测没问题后就高高兴兴上线了,然而没过多久就有商家上报说页面报错没数据,于是我赶紧复现,但怎么都复现不出来,然后问商家浏览器是不是版本太低,网络是不是不稳定之类的,但商家的浏览器和网络环境都没问题,这就纳闷了,于是果断找了一台 Windows
机器(因为我们都是Mac而且没装虚拟机),让商家加 QQ
远程协助看一下到底报了什么错,倒腾了半天,连上商家电脑,复现果然报错了 NetWork Error
,打开 Chrome Devtools
一查, ajax
请求居然没没发出去。看了一眼浏览器上那一排插件,怀疑是不是插件搞的鬼,发现居然有屏蔽广告的插件,大哥,你特么自己都在我们平台上投广告,你还装屏蔽广告插件。果断让他关闭这个插件,然后果然没问题。原来我们的接口URL里有 advertisement
这个单词,插件直接屏蔽了这个URL。没过多久,又有一个商家报页面没数据,呵呵,我们直接叫他关闭浏览器屏蔽广告插件,结果商家告诉我还是不行。?,还是远程协助查一下,发现开了隐身窗口,接口还是没返回数据,看到商家电脑右下角运行的系统杀毒软件,眉头一皱,难道是这货搞的鬼?打开设置一看,赫然有屏蔽广告这个选项。果然国产软件都流氓,你这所有的浏览记录都被人家知道了啊。第二天果断把 advertisement
改成gg(guanggao)
,整个世界都清净了。
断头鬼
过了一段时间,我司搭了一个前端错误监控平台,可以收集客户端错误,上报到这个平台然后邮件告警开发者。收集的信息包括用户操作系统、浏览器版本、 IP
、操作路径等,这样就不需要再用 Windows
远程了。某一天,告警平台发邮件报错,店铺选择页面 js
运行报错,那还得了,选择不了店铺,相当于我们的后台入口挂了啊。果断按照报错的操作路径操作一次,又没复现。再一看操作系统与浏览器版本,找了一个一模一样的环境,还是复现不出来。晕了,还是用远程协助吧。商家那里确实有 js
运行报错,由于线上 js
也没有 source map
,压缩的代码也看不懂,查半天也没查出什么东西。回到监控平台后台,反复比对各条报错。结果发现 IP
都是差不多的范围,一查都是合肥电信的运营商,难道所有合肥电信的用户加载的这个 js
有问题?然后报给运维同学,他把那个 js
下载下来一看,长度不一样,和正常的版本比,少了一小段。肯定是 cdn
同步的时候,出了故障,果断把锅丢给七牛。
替死鬼
前几天,有一次发布后,一直收到邮件告警某个 base
的 js
运行报错,涉及的浏览器版本都是Chrome 31到37
,轻车熟路开虚拟机复现,找半天找了一个Chrome 31
,确实报错了,然而报错内容看不懂。想着那天发布内容包括升级基础 react
组件,加了一个 babel runtime
,还有一些其他的改动,难道是这些问题引起的?
然后尝试想让虚拟机 Chrome
运行本地代码,于是在 win
里面装 node
、 git
、下载仓库、打包、把线上代码代理到本地。结果node-modules
都装不上去。然后再试试装 fiddler
抓包软件,把打包后的代码放在 win
里面,抓取那几个 js
,替换成打包后的本地代码,然而还是看不懂,只知道是一个基础函数,可能是 babel polyfill
的问题,于是尝试把前端仓库那几天的改成一一 revert
,看看到底是哪个改动导致的问题。结果回退到发布之前都还是报错,这就尴尬了,至此我已经花了一天时间去排查这个问题,期间让几个同事一起排查也没发现问题本源。
最后想着把 win
的网络设置成 Mac
一样的网络,把 win
浏览器使用 SwitchySharp
设置成 Mac
的代理,这样就可以在 win
里面使用 Mac
的开发环境,(其实就是在 Mac
起一个 node
服务,监听一个端口,在这个服务里把所有的线上的前端资源( js
, css
)替换成本地代码,本地这个服务相当于一个网关服务器,还可以把网址指向不同环境的服务器。)结果惊奇的发现在预发环境是没有问题的,只有线上环境才有报错。我的第一反应是难道后端改造了什么数据类型?把线上数据和预发环境数据比对一下,然而一模一样。这个时候,对比两个环境只有两个差异了,一个线上环境多一个统计日志上报的 js
,还有一个就是错误收集上报的 js
,问了一下这两个 js
的维护者,果然统计日志的js,在那次发布的时候改动了,为了使用Object.assign
,加了一个 polyfill
,然后和 base js
里面的 polyfill
冲突了,由于统计日志的 js
先加载,所以报错是在 base js
里面。
这个问题比较难排查的地方是:
- 复现环境比较苛刻
- 后端仓库的改动(统计日志的
js
)和前端仓库产生了关联,版本回退难以排查 - 产生问题的
js
并不是出现报错的js
总结
出现BUG在所难免,代码逻辑、浏览器兼容性、网络故障等等都会导致一些意想不到的问题,遇到问题首先不要慌,解决问题要有方法论,先把问题复现出来,然后使用 Chrome Devtools
,设置断点,观察数据条件,基本可以找出代码错误,其他问题,可以类似高中生物实验,结合条件对照,找出差异的条件,定位到问题,这个过程中需要敏锐的观察力。
2017年经历的那些灵异事件相关推荐
- 灵异事件 !同一个代码在code::blocks和Dev上面运行结果不一样!(一番分析后找到原因!)
我今天在code的时候发现了一个灵异事件 !同一个代码在code::blocks和Dev上面运行结果不一样! 如图,同一个代码文件在两个编译器上的输出不同: 同样的代码在code::blocks上输出 ...
- TextBox灵异事件之背后神秘的深度灵异事件真相揭秘
最近又忙于秋色园和微博粉丝精灵的开发,本来N天前应该出来的文,迟来了好几天,今天抽空写了写,把事件的真相给大伙说清楚: 上篇:半解TextBox灵异事件背后神秘的深度灵异事件,一文中,一共提出两个问题 ...
- 又见灵异事件,li中的span右浮动遇到的问题
最新又见灵异事件,li中的span右浮动遇到的问题 以下是三零网为大家整理的最新又见灵异事件,li中的span右浮动遇到的问题的文章,希望大家能够喜欢! 新闻列表中为了显示时间,加了个span < ...
- 世界十大无法科学解释灵异事件(进来发表自己看发)
1.法老咒语(世界最大灵异事件) 2.葡萄牙灵异事件(在网上引起了极大的轰动) 3.伦敦塔闹鬼(超著名) 4.20世纪上海滩灵异事件(孟小冬照片灵异事件) 5.鬼脸(墙壁上出现灵异鬼脸) 6 ...
- 半解TextBox灵异事件背后神秘的深度灵异事件
2019独角兽企业重金招聘Python工程师标准>>> TextBox灵异事件: 就在前几天,当我来到当下所在的网络时,查看微博粉丝精灵后台时,一件很灵异的事情发生了:TextBox ...
- 重大灵异事件!我的手机大半夜地自己在B站看番剧!!!
我把灵异过程录下来了,速看! 重大灵异事件!我的手机大半夜地自己在B站看番剧!!! 其实,我利用了appium+python实现手机自动化爬虫B站热门番剧数据功能,具体操作如下: 一.搭建环境 1.搭 ...
- printf 中的伪灵异事件
printf 中的 %c 输出的伪灵异事件 问题描述: 定位到下面代码,unsigned char数组 fqdn 存放一些字符串.如果按照下面代码编译,则可以正常工作,但如果将 problem lin ...
- 提莫隐身+机器人能钩_英雄联盟惊现“灵异事件”,机器还能钩中提莫蘑菇!亚索无辜躺枪...
原标题:英雄联盟惊现"灵异事件",机器还能钩中提莫蘑菇!亚索无辜躺枪 英雄联盟惊现"灵异事件",机器还能钩中提莫蘑菇!亚索无辜躺枪 相信一些喜欢玩英雄联盟的小伙 ...
- 《侠盗飞车手 圣安地列斯》灵异事件
ROCKSTAR在圣安地列斯中带给我门不只是暴力性×××,还有鬼怪...没碰见过? 这里是一些玩家说的灵异事件,大家有胆量就去求证一下吧... 一.无人驾驶的Glendale 在Chillid山上的树 ...
最新文章
- 下列哪些说法符合《阿里巴巴Java开发手册》
- 机器学习与深度学习常见面试问题与答案
- backlight 子系统(转载)
- web前端 学习线路
- foldable bike
- 灵感编程:最大公约数算法解析
- hive源碼編譯(失敗記錄)
- 扒几个 3D 模型备用
- React:Conditional Rendering(条件渲染)
- 软件自动化测试学习步骤
- Java线程之线程的五种状态
- 小型团队项目管理_寻找小型工程团队的项目管理平衡
- python批量下载邮件附件
- [日推荐]『明星在哪儿』这可能是你离爱豆最近的一次!
- 牛客算法課 (算法入門班) 二分, 三分, 01分數規劃
- SSL/TLS 通信过程
- 错误 不存在从 “std::string“ 到 “LPCSTR“ 的适当转换函数
- 一粒云文控模块使用心得
- 程序员的吐槽大会,动机何在?
- 图集谷-写真集-爬虫-1.0
热门文章
- RMS Server打开或关闭日志记录
- 自定义注解判空简单示例
- 色差仪软件的安装和电池充电
- 一步一步教你玩转.NET Framework的配置文件app.config (转载)
- 疯狂.NET 通用权限设计 C\S后台管理,B\S前台调用源码样例程序源码下载之 --- 操作权限...
- 优雅的closesocket
- Windows Server 2012 如何将计算机图标添加到桌面
- IntelliJ Idea学习笔记003---IDEA中打开Run DashBoard的方法
- C#.Net工作笔记009---c#中Yield Return语法的作用和好处
- Linux yum更新源url