浣滀负涓€鍚嶅墠绔紑鍙戣€咃紝鏄笉鏄瘡娆＄湅鍒版祻瑙堝櫒鎺у埗鍙颁俊鎭腑鐨勭孩鑹查敊璇彁绀猴紝閮戒細鎰熷埌绱у紶鈥︹€﹀埆鎬曪紝涓嬮潰鎴戜滑灏辨潵璇磋寮傚父鎹曡幏鍦ㄥ墠绔€傚紓甯告崟鑾峰彲鑳芥病鏈夐偅涔堥噸瑙嗗叾浠栫煡璇嗙偣锛屽挨鍏舵槸鍓嶇绋嬪簭鍛樸€備絾鏄笉寰椾笉璇达紝杩欏張鏄竴涓笉寰椾笉闈㈠鐨勭煡璇嗙偣銆備负浠€涔堣鎹曡幏寮傚父锛熼鍏堬紝涓轰粈涔堟垜浠渶瑕佹崟鑾峰苟鎶ュ憡寮傚父锛熶織璇濊锛岀櫨瀵嗕竴鐤忥紝鐢ㄧ▼搴忓憳鐨勮瘽鏉ヨ锛氫笘鐣屼笂娌℃湁娌℃湁bug鐨勭▼搴忥紙涓嶅弽椹仇煠愶級銆傚嵆浣跨粡杩囧悇绉嶆祴璇曪紝鍓嶇璁粌涔熶細鏈夐潪甯搁殣钄界殑bug銆傚彧鏈夐€氳繃瀹屽杽鐨勭洃鎺ф満鍒讹紝鎵嶈兘鏈夋晥鍑忓皯姝ょ被涓嶅彲棰勮闂閫犳垚鐨勬崯澶便€傚洜姝わ紝瀵逛簬绂荤敤鎴锋渶杩戠殑鍓嶇锛屼负浜嗚繙绋嬪畾浣嶉棶棰橈紝鎻愬崌鐢ㄦ埛浣撻獙锛屽紓甯告崟鑾峰拰涓婃姤闈炲父閲嶈銆傜洰鍓嶅競闈笂鏈変竴浜涢潪甯稿畬鍠勭殑鍓嶇鐩戞帶绯荤粺锛屾瘮濡侳undebug銆丅ugsnag绛夛紝铏界劧杩欎簺鍙互甯姪鎴戜滑瀹炴椂鐩戞帶鐢熶骇鐜鐨勫紓甯告儏鍐碉紝浣嗘槸濡傛灉鎴戜滑涓嶄簡瑙ｅ紓甯告槸濡備綍鍙戠敓鐨勯兘鐢熸垚浜嗭紝鎬庝箞鎵嶈兘寰楀績搴旀墜鍛紵濡備綍瀹氫綅鍜屽鐞嗛棶棰橈紵瀵逛簬JS锛屾垜浠彧闈复寮傚父銆傚紓甯哥殑鍙戠敓涓嶄細鐩存帴瀵艰嚧JS寮曟搸宕╂簝锛屾渶澶氬彧鏄粓姝㈠綋鍓嶄唬鐮佺殑鎵ц銆備笅闈㈣В閲婁竴涓嬭繖鍙ヨ瘽锛?script>error//瀵逛簬鏈畾涔夌殑鍙橀噺锛岃繖閲屼細鎶ラ敊console.log('willneverbeexecuted');寮傚父鎹曡幏鍒嗙被杩欓噷鎴戝仛浜嗕竴涓剳鍥炬潵鎬荤粨涓€浜涘墠绔殑寮傚父锛屼笉涓€瀹氭纭紝鍙槸涓€涓ぇ姒傜殑鍗拌薄銆傚涓嬶細涓嬮潰涓€涓€鍒嗘瀽涓嶅悓寮傚父鐨勬崟鑾凤細瀵箃ry...catch鐨勮瑙ry...catch鍙兘鎹曡幏鍚屾杩愯鏃堕敊璇紝瀵逛簬璇硶閿欒鍜屽紓姝ラ敊璇棤鑳戒负鍔涖€?.鍚屾杩愯鏃堕敊璇痶ry{letname='Jack';console.log(nam);}catch(e){console.log('caughtexception:',e);}杈撳嚭锛氭崟鑾峰紓甯革細ReferenceError锛歯am鏈湪:3:152澶勫畾涔夈€傛棤娉曟崟鑾疯娉曢敊璇€傛垜浠慨鏀逛唬鐮佸苟鍒犻櫎鍗曞紩鍙穞ry{letname='Jack;console.log(nam);}catch(e){console.log('Exceptioncaught:',e);}Output:UncaughtSyntaxError:InvalidorunexpectedtokensyntaxerrorSyntaxError锛寃indow.error鍜宼ry...catch閮芥棤娉曟崟鎹夊埌寮傚父銆備笉杩囦笉鐢ㄦ媴蹇冿紝鍦ㄦ偍缂栧啓浠ｇ爜骞舵寜涓嬩繚瀛樼殑閭ｄ竴鍒伙紝缂栬瘧鍣ㄤ細涓烘偍妫€鏌ヨ娉曢敊璇€傚鏋滄湁閿欒锛屼細鏈夋槑鏄剧殑绾㈣壊娉㈡氮绾匡紝榧犳爣涓婄Щ鍙互鐪嬪埌閿欒淇℃伅銆傛墍浠ワ紝闈㈠SyntaxError璇硶閿欒锛屼竴瀹氳灏忓績璋ㄦ厧3.寮傛閿欒try{setTimeout(()=>{undefined.map(v=>v);},1000)}catch(e){console.log('Caughtexception:',e);}Output:UncaughtTypeError:Cannotreadproperty'map'ofundefinedatsetTimeout(:3:11)濡傛偍鎵€瑙侊紝娌℃湁鎹曡幏鍒板紓甯搞€倃indow.onerror涓嶆槸涓囪兘鐨勩€傚綋鍙戠敓JS杩愯鏃堕敊璇椂锛寃indow浼氳Е鍙慐rrorEvent鎺ュ彛鐨勯敊璇簨浠讹紝鎵цwindow.onerror()銆?*@param{String}message閿欒淇℃伅@param{String}婧愰敊璇枃浠禓param{Number}lineno琛屽彿@param{Number}colno鍒楀彿@param{Object}error閿欒瀵硅薄(object)*/window.onerror=function(message,source,lineno,colno,error){console.log('Exceptioncaught:',{message,source,lineno,colno,error});}1.鍚屾杩愯鏃堕敊璇痺indow.onerror=function(message,source,lineno,colno,error){//message:閿欒淇℃伅锛堝瓧绗︿覆锛夈€?/source:鍙戠敓閿欒鐨勮剼鏈琔RL(string)//lineno:鍙戠敓閿欒鐨勮鍙?number)//colno:鍙戠敓閿欒鐨勫垪鍙?number)//error:閿欒瀵硅薄(object)console.log('鎹曡幏寮傚父锛?,{message,source,lineno,colno,error});}UndefVar;鍙互鐪嬪埌锛屾垜浠崟鑾蜂簡涓€涓紓甯革細2.璇硶閿欒window.onerror=function(message,source,lineno,colno,error){console.log('Caughtanexception:',{message,source,lineno,colno,閿欒});}letname='Jack;//lesssinglequotesconsole鎵撳嵃鍑鸿繖鏍蜂竴涓紓甯革細UncaughtSyntaxError:Invalidorunexpectedtoken鍙互鐪嬪嚭娌℃湁鎹曡幏鍒板紓甯搞€?.寮傛杩愯鏃堕敊璇痺indow.onerror=function(message,source,lineno,colno,error){console.log('Exceptioncaught:',{message,source,lineno,colno,error});}setTimeout(()=>{UndefVar;});鍙堢湅鍒颁簡锛屾垜浠崟鑾峰埌浜嗗紓甯革細4.缃戠粶璇锋眰寮傚父colno,error});returntrue;}鎴戜滑鍙戠幇鏃犺鏄潤鎬佽祫婧愬紓甯歌繕鏄帴鍙ｅ紓甯搁兘鏃犳硶鎹曟崏鍒伴敊璇€傛敞鎰忥細1銆佸彧鏈墂indow.onerror鍑芥暟杩斿洖true鏃讹紝鎵嶄笉浼氬悜涓婃姏鍑哄紓甯革紙娴忚鍣ㄦ敹鍒板悗浼氭姤绾級锛屽惁鍒欏嵆浣跨煡閬撲簡鎺у埗鍙拌繕鏄細鏄剧ずUncaughtError:xxxxx2.window鍙戠敓寮傚父銆俹nerror鏈€濂藉啓鍦ㄦ墍鏈塉S鑴氭湰鐨勫墠闈紝鍚﹀垯鍙兘鎶撲笉鍒伴敊璇?.window.onerror鎶撲笉鍒拌娉曢敊璇偅涔堥棶棰樻潵浜嗭紝濡備綍鎶撻潤鎬佽祫婧愬姞杞介敊璇憿锛焪indow.addEventListener褰撹祫婧愶紙濡傚浘鐗囥€佽剼鏈級鍔犺浇澶辫触鏃讹紝鍔犺浇璇ヨ祫婧愮殑鍏冪礌浼氳Е鍙慐vent鎺ュ彛鐨勯敊璇簨浠讹紝瀵硅鍏冪礌鎵цonerror澶勭悊鍑芥暟銆傝繖浜涢敊璇簨浠朵笉浼氬啋娉″埌绐楀彛锛屼絾锛堣嚦灏戝湪Chrome涓級鍙互琚崟涓獁indow.addEventListener鎹曡幏銆?script>window.addEventListener('error',(error)=>{console.log('Exceptioncaught:',error);},true)寮傚父鎹曡幏鑳藉姏锛氱敱浜庣綉缁滆姹傚紓甯镐笉浼氬紩璧蜂簨浠跺啋娉★紝鎵€浠ュ繀椤诲湪鎹曡幏闃舵鎹曡幏銆備絾鏄繖绉嶆柟娉曡櫧鐒跺彲浠ユ崟鎹夊埌缃戠粶璇锋眰寮傚父锛屼絾鏄棤娉曞垽鏂璈TTP鐨勭姸鎬佹槸404杩樻槸鍏朵粬銆傛瘮濡?00绛夛紝鎵€浠ラ渶瑕侀厤鍚堟湇鍔″櫒鏃ュ織杩涜鎺掓煡鍒嗘瀽銆傛敞鎰忥細涓嶅悓娴忚鍣ㄨ繑鍥炵殑閿欒瀵硅薄鍙兘涓嶅悓锛岄渶瑕佹敞鎰忓吋瀹瑰鐞嗐€傛敞鎰忛伩鍏峸indow.addEventListener閲嶅鐩戝惉銆傝嚦姝わ紝鎴戜滑浜嗚В鍒帮細鍦ㄥ紑鍙戠殑杩囩▼涓紝瀵逛簬瀹规槗鍑洪敊鐨勫湴鏂癸紝鍙互浣跨敤try{}catch(){}鏉ユ崟鎹夐敊璇紝鍋氬ソ澶勭悊锛岄伩鍏嶉〉闈㈡寕璧枫€傚浜庡叏灞€閿欒鎹曡幏锛屽湪鐜颁唬娴忚鍣ㄤ腑锛屾垜鍊惧悜浜庡彧浣跨敤window.addEventListener('error'),window.addEventListener('unhandledrejection')銆傚鏋滈渶瑕佽€冭檻鍏煎鎬э紝闇€瑕佹坊鍔爓indow.onerror锛屼笁鑰呭悓鏃朵娇鐢ㄣ€倃indow.addEventListener('error')涓撻棬鐢ㄤ簬鎹曡幏璧勬簮鍔犺浇閿欒銆侾romiseCatch鎴戜滑鐭ラ亾鍦╬romise涓娇鐢╟atch鍙互闈炲父鏂逛究鐨勬崟鑾峰紓姝ラ敊璇€傚湪娌℃湁catch鐨刾romise涓姏鍑虹殑閿欒鏄棤娉曡onerror鎴杢ry...catch鎹曡幏鐨勶紝鎵€浠ヤ竴瀹氳鍦╬romise涓啓涓€涓猚atch鐢ㄤ簬寮傚父澶勭悊銆傛槸鍚﹀瓨鍦ㄥ叏灞€鎹曡幏鎵胯寮傚父锛熺瓟妗堟槸鑲畾鐨勩€傚彲浠ュ叏灞€鐩戞帶UncaughtPromiseError锛屼娇鐢細window.addEventListener("unhandledrejection",function(e){//e.preventDefault();//闃叉寮傚父琚姏涓婂幓console.log('Catchexceptions:',e);});Promise.reject('鎵胯閿欒');涔熷彲浠atcherror锛氭墍浠ワ紝鎴戜滑涓婇潰璇翠簡锛屼负浜嗛槻姝issedpromise寮傚父锛屽缓璁叏灞€娣诲姞涓€涓猽nhandledrejection鐨刴onitor锛岀敤鏉ュ叏灞€鐩戞帶UncaughtPromiseError銆俰frameexception瀵逛簬iframe寮傚父鎹曡幏锛屾垜浠笉寰椾笉浣跨敤window.onerror锛歸indow.onerror=function(message,source,lineno,colno,error){console.log('caughtexception:',{message,source,lineno,colno,error});}杩欐槸涓€涓畝鍗曠殑渚嬪瓙锛?iframesrc="./iframe.html"frameborder="0">鑴氭湰閿欒鏄湪閿欒鎹曡幏鐨勮繃绋嬩腑寰堝鎯呭喌涓嬶紝鏃犳硶寰楀埌瀹屾暣鐨勯敊璇俊鎭紝鍙兘寰楀埌鈥淪criptError鈥濄€傚師鍥犳槸鐢变簬12骞村墠杩欑瘒鏂囩珷鎻愬埌鐨勫畨鍏ㄩ棶棰橈細https://blog.jeremiahgrossman...褰撲粠涓嶅悓鍩熷姞杞界殑鑴氭湰鍑虹幇璇硶閿欒鏃讹紝涓轰簡閬垮厤淇℃伅娉勯湶锛岃鎯呭皢涓嶄細鎶ュ憡璇硶閿欒锛屼絾浼氭樉绀轰竴涓畝鍗曠殑鈥滆剼鏈敊璇€濄€傚弽鑰屻€備竴鑸潵璇达紝椤甸潰鐨凧S鏂囦欢鏀惧湪CDN涓紝椤甸潰鏈韩鐨刄RL瀛樺湪璺ㄥ煙闂锛屽鑷粹€淪criptError鈥濄€傝В鍐虫柟娉曚竴鑸儏鍐典笅锛屽鏋滃嚭鐜癝cripterror涔嬬被鐨勯敊璇紝鍩烘湰鍙互纭畾鏄法鍩熼棶棰樸€傝繖鏃跺€欏叾浠栫殑杈呭姪淇℃伅灏变笉浼氬お澶氫簡锛岃В鍐虫柟娉曟棤澶栦箮濡備笅锛氳法鍩熻祫婧愬叡浜満鍒讹紙CORS锛夛細鎴戜滑鍦╯cript鏍囩涓姞鍏rossOrigin灞炴€с€?scriptsrc="http://jartto.wang/main.js"crossorigin>Crash鍜宖reeze鏄寚缃戦〉鏆傛椂鍝嶅簲鍙樻參锛孞S鍙兘鏃犳硶鍙婃椂鎵ц銆備絾宕╂簝鏄笉鍚岀殑銆傜綉椤靛穿婧冿紝JS娌℃湁杩愯銆傛湁浠€涔堝姙娉曞彲浠ョ洃鎺х綉椤靛穿婧冨苟鎶ュ憡缃戦〉宕╂簝锛?銆佸埄鐢╳indow瀵硅薄鐨刲oad鍜宐eforeunload浜嬩欢瀹炵幇瀵圭綉椤靛穿婧冪殑鐩戞帶銆倃indow.addEventListener('load',function(){sessionStorage.setItem('good_exit','pending');setInterval(function(){sessionStorage.setItem('time_before_crash',newDate().toString());},1000);});window.addEventListener('beforeunload',function(){sessionStorage.setItem('good_exit','true');});if(sessionStorage.getItem('good_exit')&&sessionStorage.getItem('good_exit')!=='true'){/insertcrashloggingcodehere/alert('鍢匡紝娆㈣繋浠庝綘鐨勫穿婧冧腑鍥炴潵锛岀湅璧锋潵浣犲穿婧冧簡锛?+sessionStorage.getItem('time_before_crash'));}2.鐢变簬浠ヤ笅鍘熷洜锛屾垜浠彲浠ヤ娇鐢⊿erviceWorker鏉ョ洃鎺х綉椤靛穿婧冿細2.1ServiceWorker鏈夎嚜宸辩嫭绔嬬殑宸ヤ綔绾跨▼锛岃繖涓庣綉椤典笉鍚屻€傚鏋滅綉椤靛穿婧冧簡锛屼竴鑸儏鍐典笅ServiceWorker鏄笉浼氬穿婧冪殑銆?.2ServiceWorker鐨勭敓鍛藉懆鏈熶竴鑸姹傛瘮缃戦〉闀匡紝鍙互鐢ㄦ潵鐩戞帶缃戦〉鐨勭姸鎬?.3缃戦〉鍙互閫氳繃navigator.serviceWorker.controller.postMessageAPI鍚戣嚜宸辫礋璐ｇ殑SW鍙戦€佹秷鎭疺UEerrorHandler鍦╒ue涓紝寮傚父鍙兘浼氳Vue鑷繁缁檛ry...catch锛屼笉浼氫紶閫掔粰window.onerror浜嬩欢瑙﹀彂鍣ㄣ€備笉杩囦笉鐢ㄦ媴蹇冿紝Vue鎻愪緵浜嗙嫭鐗圭殑寮傚父鎹曡幏銆傛瘮濡傚湪Vux2.x涓紝鎴戜滑鍙互杩欐牱浣跨敤锛歏ue.config.errorHandler=function(err,vm,info){let{message,//寮傚父淇℃伅鍚嶇О,//寮傚父鍚嶇О鑴氭湰,//寮傚父鑴氭湰urlline,//寮傚父琛屽彿鍒?//寮傚父鍒楀彿stack//寮傚父鍫嗘爤淇℃伅}=err;//vm鏄姏鍑哄紓甯哥殑Vue瀹炰緥//info鏄疺ue鐗瑰畾鐨勯敊璇俊鎭紝渚嬪閿欒鎵€鍦ㄧ殑鐢熷懡鍛ㄦ湡閽╁瓙}React涓殑寮傚父鎹曡幏锛屽彲浠ヤ娇鐢‥rrorBoundary缁勪欢鏉ユ崟鑾峰寘鎷笟鍔＄粍浠跺湪鍐呯殑寮傚父銆傞€氳繃React16.0+鏂板鐨刢omponentDidCatchAPI锛屽彲浠ュ疄鐜扮粺涓€鐨勫紓甯告崟鑾峰拰鏃ュ織涓婃姤銆備妇涓皬渚嬪瓙锛屼笅闈omponentDIdCatch(error,info)涓殑绫讳細鎴愪负閿欒杈圭晫锛殅componentDidCatch(error,info){//DisplayfallbackUIthis.setState({hasError:true});//涔熷彲浠ヨ褰曢敊璇埌鎶ラ敊servicelogErrorToMyService(error,info);}render(){if(this.state.hasError){//浣犲彲浠ユ覆鏌撲换浣曡嚜瀹氫箟鍥為€€UIreturn

鍑轰簡鐐归棶棰樸€?/h1>;}returnthis.props.children;}}鐒跺悗鎴戜滑鍍忔櫘閫氱粍浠朵竴鏍蜂娇鐢ㄥ畠锛歁yWidget/>componentDidCatch()鏂规硶鐨勪綔鐢ㄧ被浼间簬JS鐨刢atch{}妯″潡锛屼絾鏄浜庣粍浠舵潵璇达紝鍙湁绫荤被鍨嬬殑缁勪欢锛坈lasscomponent锛夊彲浠ヤ綔涓洪敊璇竟鐣屻€備簨瀹炰笂锛屽ぇ澶氭暟鏃跺€欐垜浠彲浠ュ湪鏁翠釜绋嬪簭涓畾涔変竴涓敊璇竟鐣岀粍浠跺苟姘歌繙浣跨敤瀹冿紒闇€瑕佹敞鎰忕殑鏄紝閿欒杈圭晫涓嶄細鎹曡幏浠ヤ笅閿欒锛氫簨浠跺鐞嗙▼搴忓紓姝ヤ唬鐮佹湇鍔＄娓叉煋浠ｇ爜鍦ㄩ敊璇竟鐣屽尯鍩熼敊璇憳瑕佸彲鐤戝尯鍩熷鍔爐ry...catch鍏ㄥ眬鐩戝惉JS寮傚父锛歸indow.onerror鍏ㄥ眬鐩戝惉闈欐€佽祫婧愬紓甯革細window.addEventListenerglobalcatchpromisewithoutcatch寮傚父锛歶nhandledrejectioniframe寮傚父锛歸indow.errorVUEerrorHandlerandReactcomponentDidCatch鐩戞帶缃戦〉宕╂簝锛歸indowobjectloadandbeforeunloadScriptErrorcross-domaincrossOrigin