Raygun을 사용하여 AngularJS_AngularJS에서 예외를 자동으로 추적합니다.

Angular.js의 가장 큰 성과 중 하나는 실용적인 예외 발생입니다. 예외 메시지는 종종 코드가 충돌한 이유를 정확히 나타낼 수 있기 때문입니다. 전 세계 수많은 브라우저에서 실행되는 대규모 클라이언트 측 웹 애플리케이션은 누락된 예외에 직면하고 있으며, 이를 포착하면 버그를 수정하고 사용자를 확보할 수 있습니다.

크로스 브라우저 및 기기 문제를 처리할 때 앱이 개발 컴퓨터에서는 정확하고 안정적으로 실행될 수 있지만 사용자의 브라우저에서는 실행되지 않을 수 있으므로 이러한 예외 메시지를 받는 것이 중요합니다.

해결책은 자동화된 예외 추적 서비스를 갖추는 것입니다. Raygun은 사용자가 아무 것도 하지 않고도 Angular 웹 앱에서 발생하는 모든 예외를 수신하여 작업을 단순화합니다. 설정이 정말 빠릅니다. 아래 단계에 따라 Raygun을 애플리케이션에 연결하세요.

설치

먼저 작은 Raygun4JS 스크립트를 다운로드하여 프로젝트에 추가하세요. 획득 방법은 3가지가 있습니다:

바우어

코드 복사 코드는 다음과 같습니다.

bower install raygun4js

NuGet에서 가져오기 - Visual Studio에서 패키지 관리자 콘솔을 열고 다음을 입력합니다.

코드 복사 코드는 다음과 같습니다.

Install-Package raygun4js

수동 다운로드 – 개발자 버전을 다운로드하려면 여기를 클릭하세요 또는 압축 버전
구성

다음으로 이 스크립트를 인용해 보세요. 정적 HTML을 사용하는 경우 페이지 또는 모듈 로더에 를 추가하세요.

마지막으로 기본 Angular 로직이 실행되기 전에 다음 코드를 호출하여 Raygun4JS를 설정합니다.

Raygun.init('YOUR_API_KEY').attach();

Raygun으로 생성된 모든 앱에 대해 API 키를 생성하고 Raygun 대시보드에서 액세스할 수 있습니다. 30일 무료 평가판을 통해 테스트해 볼 수 있습니다.
Angular에서 예외 잡기

데코레이터나 팩토리를 사용하여 처리되지 않은 예외를 Angular.js 모듈에 삽입하는 방법에는 최소한 두 가지가 있습니다. 이 두 가지 방법은 $ExceptionHandler의 특정 구현을 제공하며 위에서 언급한 Raygun4JS는 구현을 Raygun으로 보냅니다.

데코레이터 사용

데코레이터 패턴은 다른 원하는 기능 간의 문제를 분리하기 위해 원래 동작을 덮어쓰지 않기 때문에 모든 서비스에 동작을 주입하는 데 매우 적합합니다. 또한 로깅 및 처리를 기록하여 Angular.js에서 예외를 처리하는 이상적인 방법입니다. $provide 서비스에서 사용할 수 있으며, 이를 우리 자신의

구현에 사용할 것입니다.

$exceptionHandler 函数:
 
app.config(function ($provide) {
 $provide.decorator("$exceptionHandler", ['$delegate', function($delegate) {
  return function (exception, cause) {
   Raygun.send(exception);
   $delegate(exception, cause);
  }
 }])
});

$delegate는 콘솔에 출력하는 원래 동작을 가져오기 위해 호출할 예외 처리기의 엔터티입니다.

필요한 만큼 다른 서비스도 만들 수 있습니다.

$provide.decorator("$exceptionHandler", ['$delegate', '$log', function($delegate, $log) {
  return function (exception, cause) {
   $log.debug('Sending to Raygun');
   Raygun.send(exception);
   $delegate(exception, cause);
  }
 }])

Angular 로직에서 검색되는 오류 유형에 따라 원인 매개변수가 채워집니다. 공장이나 서비스에서 예외가 발생하면 매개변수가 될 수 있는 범위를 얻을 수 있으며, 이를 사용자 정의하여 사용할 수 있습니다. 위의 Raygun.send 호출을 필요한 다른 항목과 함께 대체하고 이를 Raygun에 전달하여 데이터를 생성합니다.

Raygun.send(exception, { cause: cause });

공장 이용

Raygun을 애플리케이션의 예외 처리기에 넣는 빠른 방법은 팩토리를 사용하는 것입니다. 단, 이 기능을 유지하고 다시 호출하려면 저장해야 하는 원래 콘솔 로그가 제거됩니다. .

app.factory('$exceptionHandler', function () {
 return function (exception) {
  Raygun.send(exception);
 }
});

수동발송 오류

Raygun4JS는 언제든지 오류를 수동으로 쉽게 추적할 수 있는 기능도 제공합니다.

Raygun.send(new Error('my custom error'));

고유 사용자 추적, 버전 추적, 태그 등을 포함하여 공급자에서 활용할 수 있는 다양한 도구가 있습니다. 에 대한 모든 신뢰 정보를 볼 수 있는 문서는 다음과 같습니다.

Raygun은 추가 작업을 수행하지 않고도 Angular 앱에서 jQuery Ajax 오류를 추적할 수 있으므로 즉시 문제를 완벽하게 처리할 수 있습니다.
Raygun을 사용할 준비가 되셨나요?

앞서 언급했듯이 30일 무료 신용카드 버전이 제공됩니다. 궁금한 점이 있으면 앱이 실제로 사용자에게 작동하는지 확인할 수 있습니다. 이 글을 아래 댓글로 남겨주세요.