Sentry-javascript: 콘솔에도 예외(`captureException`)를 기록하는 방법

이러한 이유로 captureException 를 래핑했습니다.

function captureException(...args) {
    if (typeof Sentry !== 'undefined') {
        Sentry.captureException(...args);
    }
    else {
        console.error(...args);
    }
}

가장 좋은 방법은 beforeSend
```js
Sentry.init({
dsn: "DSN",
beforeSend: 이벤트 => {
if (IS_DEBUG) {
console.error(이벤트);
null을 반환합니다. // 이것은 이벤트를 삭제하고 아무 것도 센트리로 보내지 않을 것입니다.
}
반환 이벤트;
}
});

beforeSend 에 대해 마음에 들지 않는 점은 원래 오류 개체를 얻지 못한다는 것입니다. 하지만 답장을 보내주셔서 감사합니다.

@gaastonsr 당신은 두 번째 인수로 수행 :) https://docs.sentry.io/learn/filtering/?platform=browser#before -send

Sentry.init({
  dsn: "DSN",
  beforeSend: (event, hint) => {
   if (IS_DEBUG) {
     console.error(hint.originalException || hint.syntheticException);
     return null; // this drops the event and nothing will be sent to sentry
   }
   return event;
  }
});

옴, 이것은 모든 것을 바꿉니다! 감사합니다, @kamilogorek.

내 콘솔이 오류를 기록하지 않는 이유를 찾는 데 30분이 걸렸습니다. 이 작업은 더 쉬워야 합니다.

여기서 문제는 기본적으로 기록하는 경우 기본적으로 이동 경로로 캡처한다는 것입니다. 그리고 우리는 이미 캡처 오류에 대해 이 작업을 수행합니다. 따라서 중복 항목이 생성됩니다.
피드백을 위해 귀가 완전히 열려 있고 누군가가 이 문서 부분을 개선하는 방법을 알고 있다면 포함하게 되어 기쁩니다. :)

여기서 문제는 기본적으로 기록하는 경우 기본적으로 이동 경로로 캡처한다는 것입니다. 그리고 우리는 이미 캡처 오류에 대해 이 작업을 수행합니다. 따라서 중복 항목이 생성됩니다.
피드백을 위해 귀가 완전히 열려 있고 누군가가 이 문서 부분을 개선하는 방법을 알고 있다면 포함하게 되어 기쁩니다. :)

Sentry가 오류를 포착하고 콘솔에 표시하지 않는 것은 정말 예상치 못한 행동입니다!
나는 또한 콘솔이 깨끗하지만 내 앱이 작동하지 않는 이유를 발견하는 데 한 시간을 보냈습니다.
이것은 반드시 변경되어야 합니다.

서버 측의 이동 경로에서 오류를 필터링할 수 있다고 생각합니다.
또는 setTimeout 콜백에서 콘솔에 기록할 수 있으므로 이동 경로가 이미 캡처됩니다. 내가 현재 하는 것처럼:

Sentry.init({
  dsn: 'DSN',
  beforeSend: (event, hint) => {
    setTimeout(() => console.error(hint.originalException || hint.syntheticException), 0);
    return event;
  }
});

@vitalets 5.9.0 에서 변경되었습니다. 이제 콘솔에도 오류가 표시됩니다.

@vitalets 5.9.0 에서 변경되었습니다. 이제 콘솔에도 오류가 표시됩니다.

@kamilogorek
sentry/browser 5.9.1 (chrome 78, osx)에서는 작동하지 않습니다.
코드는 다음과 같습니다.

Sentry.init({  dsn: 'dsn' });
setTimeout(() => {throw new Error('abc')}, 3000);

콘솔이 비어 있습니다. 네트워크 탭은 오류가 센트리로 전송되었음을 보여줍니다.

센트리 없이 오류가 표시됩니다.

// Sentry.init({  dsn: 'dsn' });
setTimeout(() => {throw new Error('abc')}, 3000);

캡처 이벤트가 아닌 captureException에 대해 기록합니다.
captureEvent 및 captureException을 기록하기 위해 @kamilogorek 의 솔루션을 약간 수정했습니다.

Sentry.init({
  dsn: "DSN",
  beforeSend: (event, hint) => {
   if (IS_DEBUG) {
     console.error(hint.originalException || hint.syntheticException || event);
     return null; // this drops the event and nothing will be sent to sentry
   }
   return event;
  }
});

@kamilogorek 도 @sentry/node 패키지의 기본값인가요? 5.9.0 버전이 있고 beforeSend 함수가 호출되는 것을 볼 수 있지만 콘솔에 아무것도 기록되지 않습니다.

또한 5.10.1을 사용하는 콘솔에 오류가 표시되지 않습니다. 디버그가 true로 설정되어 있으면 로깅으로 충분합니다.

스펙을 끝까지 안읽으면 이렇게 되는구나...

https://html.spec.whatwg.org/multipage/webappapis.html#the -event-handler-processing-algorithm

특수 오류 이벤트 처리가 true인 경우
반환 값이 true이면 이벤트의 취소 플래그를 설정합니다.
그렇지 않으면
반환 값이 false이면 이벤트의 취소 플래그를 설정합니다.

그리고 스크롤을 내리면...

역사적 이유로 플랫폼에는 두 가지 예외가 있습니다.
true를 반환하면 이벤트가 취소되는 전역 객체의 onerror 핸들러

그에 따라 코드를 업데이트하겠습니다

스펙 안읽으면 생기는 일

아무도 사양을 끝까지 읽지 않습니다. :)

수정해주셔서 감사합니다!

이 스레드를 올바르게 읽고 있다면 현재 센트리 릴리스는 콘솔에 오류를 표시하는 동시에 센트리 대시보드에도 오류를 전송해야 합니다. 이 동작이 발생하지 않습니다.

내 페이지에 센트리를 로드하는 방법은 다음과 같습니다.

<script src="https://browser.sentry-cdn.com/5.20.1/bundle.min.js" integrity="sha384-O8HdAJg1h8RARFowXd2J/r5fIWuinSBtjhwQoPesfVILeXzGpJxvyY/77OaPPXUo" crossorigin="anonymous"></script>
<script src="https://browser.sentry-cdn.com/5.20.1/vue.min.js" crossorigin="anonymous"></script>

다음은 초기화 호출입니다.

  Sentry.init({
    dsn: 'https://_________.ingest.sentry.io/___________',
    integrations: [new Sentry.Integrations.Vue({Vue, attachProps: true})],
  });

다음 오류 생성 라인을 추가했습니다.

 window.undef.undef += 1;

페이지를 로드하고 오류 줄을 트리거하면 콘솔에 아무 것도 표시되지 않지만 센트리 대시보드에는 오류가 표시됩니다. Sentry.init 호출을 주석 처리하면 js 콘솔에 TypeError 가 표시됩니다.

이 스레드를 읽은 결과 js 콘솔에서 오류가 표시되는 동시에 센트리 대시보드에 로깅할 것으로 예상했습니다. 옳지 않습니까? 여전히 beforeSend 후크를 사용해야 합니까?

이제 logErrors: true 를 Integrations.Vue 호출에 전달해야 한다는 것을 깨달았습니다.

new Sentry.Integrations.Vue({Vue, attachProps: true, logErrors: true}

죄송합니다. 문서를 더 자세히 읽었어야 했습니다!