摘要:同源策略解釋之前,我們先簡(jiǎn)單聊聊同源策略。當(dāng)這些從第三方加載的腳本執(zhí)行出錯(cuò),因?yàn)檫`背了同源策略為了保證用戶信息不被泄露,錯(cuò)誤信息不會(huì)顯示出來,取而代之只會(huì)返回一個(gè)。
一些用戶向我們反饋,F(xiàn)undebug的JavaScript監(jiān)控插件抓到了很多Script error.,然后行號(hào)和列號(hào)都是0...這就很尷尬了。
今天,我們來詳細(xì)地解析一下Script error.,后續(xù)我們還會(huì)深度測(cè)試并且提供解決方法。
同源策略 (Same origin policy)解釋Script error.之前,我們先簡(jiǎn)單聊聊同源策略。摘自MDN - Same-origin policy:
Two pages have the same origin if the protocol, port (if one is specified), and host are the same for both pages.
所謂同源,就是指兩個(gè)頁面具有相同的協(xié)議、端口和主機(jī)(域名)。通過第三方加載的JavaScript腳本是不同源的。下面的表格簡(jiǎn)單列出了和https://fundebug.com/app.js是否同源的文件:
網(wǎng)址 | 是否同源 | 原因 |
---|---|---|
https://fundebug.com/vendor.js | 是 | |
http://fundebug.com/vendor.js | 否 | 協(xié)議不同 |
https://fundebug.com:8001/app.js | 否 | 端口不同 |
https://docs.fundebug.com/nav.js | 否 | 子域名不同 |
https://kiwenlau.com/totop.js | 否 | 域名不同 |
沒有同源策略的話,將會(huì)怎樣?摘自同源策略詳解及繞過 - FreeBuf:
為啥出現(xiàn)Script error. ?假設(shè)你已經(jīng)成功登錄Gmail服務(wù)器,同時(shí)在同一個(gè)瀏覽器訪問惡意站點(diǎn)(另一個(gè)瀏覽器選項(xiàng)卡)。沒有同源策略,攻擊者可以通過JavaScript獲取你的郵件以及其他敏感信息,比如說閱讀你的私密郵件,發(fā)送虛假郵件,看你的聊天記錄等等。 如果將Gmail替換為你的銀行帳戶,問題就大條了。
為了提升網(wǎng)站的訪問速度,我們通常都會(huì)將靜態(tài)資源文件(css, image, javascript)放在第三方CDN。當(dāng)這些從第三方加載的JavaScript腳本執(zhí)行出錯(cuò),因?yàn)檫`背了同源策略, 為了保證用戶信息不被泄露,錯(cuò)誤信息不會(huì)顯示出來,取而代之只會(huì)返回一個(gè)Script error.。
暴露錯(cuò)誤信息會(huì)怎樣呢?摘自(Cryptic “Script Error.” reported in Javascript in Chrome and Firefox):
源碼假想你不小心訪問了一個(gè)惡意網(wǎng)站,網(wǎng)頁里面偷偷放入了一段JavaScript腳本 ,這段腳本指向你使用的某銀行網(wǎng)站首頁。雖然腳本會(huì)執(zhí)行失敗,但是錯(cuò)誤信息卻有可能泄露你的信息。如果你已經(jīng)登錄過該銀行網(wǎng)站并且處于登錄狀態(tài),那么錯(cuò)誤信息可能為"歡迎你 ...." is undefined;如果你沒有登錄,那么錯(cuò)誤信息可能是"請(qǐng)登錄..." is undefined。 然后黑客就可以根據(jù)這些信息確定你使用的銀行網(wǎng)站,并且偽造一個(gè)釣魚網(wǎng)站來騙取錢財(cái)。
webkit源碼如下:
bool ScriptExecutionContext::dispatchErrorEvent(const String& errorMessage, int lineNumber, const String& sourceURL) { EventTarget* target = errorEventTarget(); if (!target) return false; ... if (securityOrigin()->canRequest(targetUrl)) { message = errorMessage; line = lineNumber; sourceName = sourceURL; } else { message = "Script error."; sourceName = String(); line = 0; } ... }
可知,瀏覽器會(huì)判斷所加載的資源url是否同源(securityOrigin()->canRequest(targetUrl)),如果不同源,則將錯(cuò)誤消息隱藏,賦值為Script error., 并且將行號(hào)設(shè)為0.
因此,如果我們從第三方CDN服務(wù)加載資源,如果出錯(cuò)的話,那么我們將只能看到Script error.。
錯(cuò)誤復(fù)現(xiàn)我們用一個(gè)簡(jiǎn)單的例子測(cè)試一下。下面是index.html,我們使用onerror來捕獲錯(cuò)誤。
Test Script error
在scripterror.js中拋出一個(gè)Error對(duì)象:
throw new Error("Hello, Fundebug");
使用的http-server掛載文件,打開http://localhost:8080/index.html,
在Chrome瀏覽器控制臺(tái)下,可以看到詳細(xì)的出錯(cuò)信息:
為了復(fù)現(xiàn)Scrpt error., 將scripterror.js放到我在coding.net的個(gè)人項(xiàng)目下面:
Test Script error
運(yùn)行http-server, 結(jié)果如下:
因?yàn)檫`背同源策略,這時(shí)只能拿到Script error.。
總結(jié)本文介紹了Script error.的由來,并提供了一個(gè)簡(jiǎn)單的實(shí)例來演示什么情況下出現(xiàn)Script error.。接下來,我們將對(duì)Script error進(jìn)行深度測(cè)試并提出解決方法
歡迎加入我們官方QQ群“全棧BUG監(jiān)控交流”622902485
版權(quán)聲明:
轉(zhuǎn)載時(shí)請(qǐng)注明作者Fundebug以及本文地址:
https://blog.fundebug.com/2017/04/05/understand-script-error/
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/82378.html
摘要:拆分了錄屏代碼,監(jiān)控插件壓縮至,另外我們還原了部分,幫助用戶更方便地。請(qǐng)大家及時(shí)更新哈拆分錄屏代碼從版本開始,我們拆分了錄屏代碼。自從年雙十一正式上線,累計(jì)處理了億錯(cuò)誤事件,付費(fèi)客戶有金山軟件百姓網(wǎng)等眾多品牌企業(yè)。 摘要: BUG監(jiān)控插件壓縮至18K。 showImg(https://segmentfault.com/img/bVbpIPC?w=900&h=383); 1.7.1拆分了...
摘要:,表示當(dāng)前錯(cuò)誤對(duì)象,包含當(dāng)前錯(cuò)誤比較詳細(xì)的堆棧等信息,需要比較新的瀏覽器才有這個(gè)參數(shù)。總結(jié)這樣我們就可以利用收集用戶的報(bào)錯(cuò)信息了完整的錯(cuò)誤收集系統(tǒng)見下面的參考鏈接。參考鏈接全面收集前端報(bào)錯(cuò)原文地址獲取最佳閱讀體驗(yàn)并參與討論,請(qǐng)?jiān)L問原文 前言 最近有個(gè)頁面寫好后在 Chrome devtools 里運(yùn)行正常,但是手機(jī)上運(yùn)行時(shí)卻出了問題,就想著在代碼里添加下面的內(nèi)容,到手機(jī)上顯示錯(cuò)誤消息 ...
摘要:上節(jié)我們講了同源策略,這節(jié)我們講講如何跨域。當(dāng)這些從的腳本執(zhí)行出錯(cuò),因?yàn)檫`背了同源策略為了保證用戶信息不被泄露,錯(cuò)誤信息不會(huì)顯示出來,取而代之只會(huì)返回一個(gè)。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門技術(shù)就算入門,但也僅僅是入門,現(xiàn)在前端開發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂(HTML/CSS/JS),本著提升技術(shù)水平,打牢基礎(chǔ)知識(shí)的中心思想,我們開課啦(每...
摘要:請(qǐng)求默認(rèn)會(huì)攜帶同源請(qǐng)求的,而跨域請(qǐng)求則不會(huì)攜帶,設(shè)置的的屬性為將允許攜帶跨域。類型請(qǐng)求成功后的回調(diào)函數(shù)。另外,同樣提供了在環(huán)境下的支持,可謂是網(wǎng)絡(luò)請(qǐng)求的首選方案。當(dāng)網(wǎng)絡(luò)故障時(shí)或請(qǐng)求被阻止時(shí),才會(huì)標(biāo)記為,如跨域不存在,網(wǎng)絡(luò)異常等會(huì)觸發(fā)。 一、前端進(jìn)行網(wǎng)絡(luò)請(qǐng)求的關(guān)注點(diǎn) 大多數(shù)情況下,在前端發(fā)起一個(gè)網(wǎng)絡(luò)請(qǐng)求我們只需關(guān)注下面幾點(diǎn): 傳入基本參數(shù)(url,請(qǐng)求方式) 請(qǐng)求參數(shù)、請(qǐng)求參數(shù)類型 設(shè)...
摘要:標(biāo)準(zhǔn)定義和用法文檔節(jié)點(diǎn)的方法用于寫入文檔內(nèi)容,可以傳多個(gè)參數(shù),寫入的字符串會(huì)按解析。在異步引入的和或事件的回調(diào)函數(shù)中運(yùn)行,運(yùn)行完后,最好手動(dòng)關(guān)閉文檔寫入。寫入的標(biāo)簽中的內(nèi)容會(huì)正常運(yùn)行。 W3C 標(biāo)準(zhǔn) WHATWG: write() 定義和用法 文檔節(jié)點(diǎn)的write()方法用于寫入文檔內(nèi)容,可以傳多個(gè)參數(shù),寫入的字符串會(huì)按HTML解析。 語法:document.write() 參數(shù):字...
閱讀 1224·2023-04-26 02:20
閱讀 3345·2021-11-22 14:45
閱讀 4163·2021-11-17 09:33
閱讀 1019·2021-09-06 15:00
閱讀 1491·2021-09-03 10:30
閱讀 3895·2021-07-26 22:01
閱讀 1000·2019-08-30 15:54
閱讀 542·2019-08-30 15:43