Sentry 无法使用 ConsoleCapture 捕获所有控制台错误答案

【问题标题】：Sentry not capture all console errors with ConsoleCaptureSentry 无法使用 ConsoleCapture 捕获所有控制台错误
【发布时间】：2022-02-17 00:14:02
【问题描述】：

我在使用 Next.js 应用程序中的 Sentry 捕获控制台错误时遇到问题。

所以问题是，在我们无权访问的库中的某个地方，WebSocket WebSocket is already in CLOSING or CLOSED state 出现以下错误

在 chrome 调试面板中很明显

但未发送到在next.config.js 中使用此代码初始化的哨兵

const withPlugins = require('next-compose-plugins');
const { withSentryConfig } = require('@sentry/nextjs');
const { CaptureConsole } = require('@sentry/integrations');

const nextConfig = {
    assetPrefix: process.env.PUBLIC_URL || '',
    reactStrictMode: true,
    poweredByHeader: false,
    future: {
        webpack5: true,
    },
}

const sentryOptions = {
    silent: true,
    environment: process.env.NODE_ENV,
    integrations: [
        new CaptureConsole({
            levels: ['error'],
        }),
    ],
    errorHandler: (err, _invokeErr, compilation) => {
        compilation.warnings.push('Sentry CLI Plugin: ' + err.message);
    },
};

module.exports = withPlugins(
    [
        [(config) => withSentryConfig(config, sentryOptions), {}]
    ],
    nextConfig,
);

而sentry.client.config.js 是

import * as Sentry from '@sentry/nextjs';
import { CaptureConsole } from '@sentry/integrations';
import { Integrations } from '@sentry/tracing';

Sentry.init({
    dsn: '...',
    attachStacktrace: true,
    environment: process.env.NODE_ENV,
    release: process.env.RELEASE,
    sampleRate: 1,
    tracesSampleRate: 0.2,
    integrations: [
        new Integrations.BrowserTracing({
            beforeNavigate: (context) => ({
                ...context,
                name: window.location.pathname,
            }),
        }),
        new CaptureConsole({
            levels: ['error'],
        }),
    ],
});

虽然另一条console.error 消息已成功发送到 Sentry。

也许该错误只是没有使用console.error 打印并在某个较低级别进行处理？那我们怎么记录呢？

【问题讨论】：

标签： javascript websocket error-handling next.js sentry

【解决方案1】：

将此作为一个方向，而不是一个完整的解决方案，它不是直截了当的，而不是依赖CaptureConsole - 你能不听socket.onclose 并使用 Sentry.captureException( 发送错误有效负载吗？

捕获套接字异常

获取所有打开的 websockets

const sockets = [];
const nativeWebSocket = window.WebSocket;
window.WebSocket = function(...args){
  const socket = new nativeWebSocket(...args);
  sockets.push(socket);
  return socket;
};
setTimeout(() => {
  // or create a button which, when clicked, does something with the sockets
  console.log(sockets);
}, 1000);
// via : https://stackoverflow.com/a/59916046/13749957

或使用wshook

https://github.com/skepticfx/wshook

一旦完成并且所有套接字都在使用中，标记到 onclose 并将其发送到哨兵

exampleSocket.onclose = function (event) {
   Sentry.captureException(...args) 
};

【讨论】：