问题描述
与 content script ，它处理所有标签页上发生的JS错误。但问题是没有任何一种常见的获取错误堆栈跟踪的方法无效。
例如，内容脚本中有代码
window.addEventListener（'error'，function（event）{
console.log（event.error.stack）; // event.error将为空
}，false）;
如果我在网页中调用这个代码，那么 event.error 将包含 Error 具有 stack 属性的对象。
使用以下方法尝试获取堆栈跟踪时出现同样的问题：
console.log（（new Error（））。stack ））;
有没有人知道一些工作问题在内容脚本中获取错误堆栈跟踪 Chrome扩展程序？
错误堆栈跟踪必须以 string 或 Array ，意味着不仅仅是通过调用 console.trace（）来获得JS控制台中的某些输出。
如何重现：
92gBZEoLCO9jPsWyKht4dbjYyo0Zk-PU5YAj0h88-3Qrel =noreferrer> https://mega.co.nz/#!ENw00YAC!92gBZEoLCO9jPsWyKht4dbjYyo0Zk-PU5YAj0h88-3Q
//此代码将被注入以运行在网页上下文中
function codeToInject（）{
window.addEventListener（'error'，function（e）{
var error = {
stack： error.stack
//在这里添加你需要的任何其他属性，比如e.filename等...
};
document.dispatchEvent（new CustomEvent（'ReportError'，{detail：错误}））;
}）;
$ b document.addEventListener（'ReportError'，function（e）{
console.log（'CONTENT SCRIPT'，e.detail.stack）;
}）;
//注入代码
var script = document.createElement（'script'）;
script.textContent ='（'+ codeToInject +'（））';
（document.head || document.documentElement）.appendChild（script）;
script.parentNode.removeChild（script）;
所使用的技术描述如下：
There is a Google Chrome extension with content script that handles JS errors occured on all tabs pages. But the problem is that no one of usual methods of getting errors stack trace does not work.
For example, there is a code in content script of Chrome extension:
window.addEventListener('error', function(event) {
console.log(event.error.stack); // event.error will be null
}, false);
If I call this code inside web page, so event.error will contains Error object with stack property.
Same problem with trying to get stack trace using:
console.log((new Error()).stack));
Does anybody knows some working issue to get error stack trace inside content script of Chrome extension?
Error stack trace must be received as string or Array, means not just like some output in JS console by calling console.trace().
How to reproduce:
- Download https://mega.co.nz/#!ENw00YAC!92gBZEoLCO9jPsWyKht4dbjYyo0Zk-PU5YAj0h88-3Q
- Unpack jzen.zip to some /jsen folder
- Open chrome://extensions in your Google Chrome, enable Developer mode http://i.imgur.com/5x5D6NP.png
- Click Load unpacked extension button and select path to /jsen folder
- Open /jsen/content.js file and add console.log('JSEN', e.error.stack); inside window.addEventListener('error', function(e) {
- Go to http://xpart.ru/_share/js.htm and see result in JS console(Ctrl+Shift+J)
- Try to edit /jsen/content.js to get correct error trace
- To reinitialize Chrome extension source code click http://i.imgur.com/SjFgkHA.png
As you mention, the error property of the event object is null when capturing the event in Content Script context, but it has the required info when captured in webpage context. So the solution is to capture the event in webpage context and use messaging to deliver it to the Content Script.
// This code will be injected to run in webpage context
function codeToInject() {
window.addEventListener('error', function(e) {
var error = {
stack: e.error.stack
// Add here any other properties you need, like e.filename, etc...
};
document.dispatchEvent(new CustomEvent('ReportError', {detail:error}));
});
}
document.addEventListener('ReportError', function(e) {
console.log('CONTENT SCRIPT', e.detail.stack);
});
//Inject code
var script = document.createElement('script');
script.textContent = '(' + codeToInject + '())';
(document.head||document.documentElement).appendChild(script);
script.parentNode.removeChild(script);
The techniques used are described in:
这篇关于如何在Chrome扩展程序内容脚本中获取错误堆栈跟踪？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！