如何从服务工作者提取中隐藏堆栈跟踪？

Question

我有这样的服务人员：

self.addEventListener('fetch', function (event) {
    event.respondWith(new Promise(function(resolve, reject) {
       // ...
       fetch(event.request).then(resolve).catch(reject);
    }));
});

我不记得我在哪里找到这段代码，但是当我将广告拦截器与 404 一起使用时，在控制台中我看到堆栈跟踪：

有没有办法摆脱那个堆栈跟踪。我只需要知道获取失败（见第二个错误消息）。

Answer 1

只需清除 stack 属性:

const e = new Error('Uh oh');
console.log(e.name, e.message, e.stack);

e.stack = '';
console.log(e.name, e.message, e.stack);

Answer 2

堆栈跟踪来自传递给 reject 方法的 Error 对象（或派生的 class）的堆栈属性。一种解决方案是使用字符串拒绝：

catch( err=>reject(err.message))

但是，如果您需要有关无法获取的 url 的更多信息，则需要将其包含在 event.request 中的信息中。如何包含它取决于 event.request 是 url 字符串、URL 或 Request 对象还是带有字符串化符的对象。如果没有确切的信息，您可以尝试

catch( err=>reject("Fetch failed to fetch " + (request?.url || request )));

Answer 3

似乎正确的方法是吞下错误，网络似乎得到正确的错误，出现在 Dev Tools 的网络和控制台选项卡中。

self.addEventListener('fetch', function (event) {
    var req = fetch(event.request).then(resolve).catch(() => {});
    event.respondWith(req);
});

如何从服务工作者提取中隐藏堆栈跟踪？

How to hide stack trace from service worker fetch?

javascript

service-worker

fetch-api