记一次前端问题解决历程(Cannot read Property 'call' of undefined)

场景

echosong 回长沙两个多月了, 新公司的创业项目 App , 小程序, 公众号。 目前差app 没有 做完。 小程序采用前端比较火的Vue 技术框架。 一直一来主要方向后端 +架构+ 管理方向。长沙的IT环境不比上海, 回来基本上全栈都要做,乃至技术意外的培训,市场。

面的辐射性扩张, 对于技术一条道走到黑的方向已经开始 往外辐射,希望未来打破职业 年龄瓶颈 运气不要太差。

言归问题

Vue+npm + webpack 相关的技术生成单页的整站应用, 自从开发完上线到目前,一直存在一个不能解决的问题。 访问时候偶尔回出现以下问题
(Uncaught TypeError: Cannot read Property 'call' of undefined) ,重现刷新下基本上又能进入。概率大概又个 10%

解决方案

初步解决

之前以为跟 webpack 打包相关, 目前对前端的驾驭,没有从根本去解决。但是出现问题的时候都是index.html 能正常加载出来,js 相关不能加载,多刷新下就能正常,基于这个前提想到了,在入口文件index.html加入了以上代码

 var refush = setInterval(function () {
            console.log('刷新补救');
            var style = window.getComputedStyle(loading);
            if ( style.display === 'none') {
                clearInterval(refush);
            } else {
                location.reload(true);
            }
    
        }, 2000) 

问题解决了一大半,正如log 打印,只是一种打不开的时候补救,未能冲根本上解决问题。

彻底解决

周末都是加班,没有休息过,昨天周日终于给自己放了个假,但是心里装着问题未解决,对于一个对技术很产品有追求的人来说,这是一种煎熬,让你没办法正常享受休息时光。 于是专门花一天时间来研究这个问题

找问题点思路:

1 、 之前这个问题曾经让前同事专门做前端的大牛帮我看,他在上海那边一直刷新,无论怎么样访问死活重现不了问题,让其他地区的小伙伴页试试了下也没有此问题
2、 打包线上才会出现这种问题,本地也没出现过
4、 再抓包看 每次加载js次序不一样
5 、 最奇怪的时候每次还会加载一个 ip 地址相关的东西,而本地报,和其他地区的包不存在

综上症状,我开始去查看会不是是哪里配置有问题,但是对比了一圈下来无果, 于是 一艘那个奇怪的ip


似乎结果开始浮出水面, 长沙地区的电信,自然想到的DNS 劫持,愤怒之下 发泄对长沙电信的恶行谴责!!

怎么解决

得知了是dns 劫持,每次劫持的js 地址不一样,他是劫持了我的脚本,然后注入了自己的一段脚本 最后在加载我的原来那个js。这样一来改变了 js 加载的次序,因为VUe框架打包的东西,加载次序是要控制的。这样一来改变了加载js 次序,那么就会导致运行程序出现最初的错误。

这种针对域名的劫持,也没有什么其他的解决办法 无非

  1. 程序执行次序调整(这个基本上不好办,因为是npm run build 以后的机制)

  2. 换域名(电信的这种注入他也是有选择性的针对预约注入,如果换个域名可以解决,但是这不符合业务上的诉求)

  3. http 换成 https 传输过程中https 需要证书,这种dns 劫持的注入是注入不了的

最终选择了第三种解决办法。整个问题得到了彻底解决。

猜你喜欢

转载自www.cnblogs.com/echosong/p/9099876.html