一文汇报你怎样优雅处理赏罚前端非常？

对付 iframe 的非常捕捉，我们还得借力 window.onerror：

window.onerror = function(message, source, lineno, colno, error) { 
console.log('捕捉到非常：',{message, source, lineno, colno, error}); 
} 

一个简朴的例子也许如下：

  
<iframe src="./iframe.html" frameborder="0"></iframe> 
<script> 
window.frames[0].onerror = function (message, source, lineno, colno, error) { 
console.log('捕捉到 iframe 非常：',{message, source, lineno, colno, error}); 
return true; 
}; 
</script> 
十、Script error 

一样平常环境，假如呈现 Script error 这样的错误，根基上可以确定是呈现了跨域题目。这时辰，是不会有其他太多帮助信息的，可是办理思绪无非如下：

跨源资源共享机制( CORS )：我们为 script 标签添加 crossOrigin 属性。

<script src="http://jartto.wang/main.js" crossorigin></script>

可能动态去添加 js 剧本：

const script = document.createElement('script'); 
script.crossOrigin = 'anonymous'; 
script.src = url; 
document.body.appendChild(script); 

出格留意，处事器端必要配置：Access-Control-Allow-Origin

另外，我们也可以试试这个-办理 Script Error 的另类思绪：

const originAddEventListener = EventTarget.prototype.addEventListener; 
EventTarget.prototype.addEventListener = function (type, listener, options) { 
const wrappedListener = function (...args) { 
try { 
return listener.apply(this, args); 
} 
catch (err) { 
throw err; 
} 
} 
return originAddEventListener.call(this, type, wrappedListener, options); 
} 

简朴表明一下：

• 改写了 EventTarget 的 addEventListener 要领；
• 对传入的 listener 举办包装，返回包装过的 listener，对其执行举办 try-catch；
• 赏识器不会对 try-catch 起来的非常举办跨域拦截，以是 catch 到的时辰，是有仓库信息的；
• 从头 throw 出来非常的时辰，执行的是同域代码，以是 window.onerror 捕捉的时辰不会丢失仓库信息；

操作包装 addEventListener，我们还可以到达「扩展仓库」的结果：

(() => { 
const originAddEventListener = EventTarget.prototype.addEventListener; 
EventTarget.prototype.addEventListener = function (type, listener, options) { 
+ // 捕捉添加变乱时的仓库 
+ const addStack = new Error(`Event (${type})`).stack; 
const wrappedListener = function (...args) { 
try { 
return listener.apply(this, args); 
} 
catch (err) { 
+ // 非常产生时，扩展仓库 
+ err.stack += 'n' + addStack; 
throw err; 
} 
} 
return originAddEventListener.call(this, type, wrappedListener, options); 
} 
})(); 

十一、瓦解和卡顿

卡顿也就是网页暂且相应较量慢， JS 也许无法实时执行。但瓦解就纷歧样了，网页都瓦解了，JS都不运行了，尚有什么步伐可以监控网页的瓦解，并将网页瓦解上报呢？

瓦解和卡顿也是不行忽视的，大概会导致你的用户流失。

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!