記一次前端問題解決歷程(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 劫持的注入是注入不了的

最終選擇了第三種解決辦法。整個問題得到了徹底解決。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM