源码网,源码论坛,源码之家,商业源码,游戏源码下载,discuz插件,棋牌源码下载,精品源码论坛

 找回密码
 立即注册
楼主: ttx9n

[JavaScript] 使用Raygun来自动追踪AngularJS中的异常

[复制链接]

7万

主题

861

回帖

32万

积分

论坛元老

Rank: 8Rank: 8

积分
329525
发表于 2018-12-25 05:24:00 | 显示全部楼层 |阅读模式
这篇文章主要介绍了使用Raygun来自动追踪AngularJS中的异常,AngularJS是一款高人气的JavaScript库,需要的朋友可以参考下

Angular.js取得的巨大成就之一是实用的异常抛出,因为异常信息经常能够准确的表明你的代码为什么崩溃了。运行于世界各地的众多浏览器的大型客户端web应用会面临异常丢失的问题,而捕获它就有可能修复 bug并赢得用户。

当处理跨浏览器和设备的问题时,接收这些异常信息是很重要的,因为你的应用可能在你的开发机器上运行得正确可靠,但在你的用户的浏览器上却是另一番场景。

其解决方案是需要一个自动异常跟踪服务,而Raygun通过接收你的Angular web应用抛出的所有异常但不需要你做任何事,从而简化了这项工作。它的设置真的很快--只需要按照以下步骤将Raygun hook到你的应用就可以了。

安装

首先,下载小巧的Raygun4JS脚本,并把它添加到你的项目中。有3个途径获得:

通过Bower
 
复制代码 代码如下:bower install raygun4js

从NuGet获得——在Visual Studio中,打开包管理器控制台然后输入:
 
复制代码 代码如下:Install-Package raygun4js

手动下载 – 点击此处下载dev版 或者压缩过的版本
配置

接下来,引用这个脚本。如果你使用静态的HTML,将<script src="js/raygun.js" type="text/javascript"></script>添加到页面里面或添加到你的模块加载器中。

最后,在你的Angular主逻辑执行之前调用下面的代码来设置Raygun4JS:
 

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

你可以为每一个用Raygun创建的app生成一个API key,你可以在你的Raygun dashboard 中访问他——你有30天免费试用时间来测试它。
在Angular中捕获异常

至少有两种方法将未处理的异常注射到Angular.js的模块中,通过使用decorator 或 factory。这两种方式会为你提供$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逻辑中抛出的错误是什么类型, cause 参数得以被填充. 如果一个异常发生在一个工厂或者服务中,你可能会得到那个参数可以的范围, 你可以将其作为自定义数据,通过替换掉上面的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错误even tracks jQuery Ajax errors ,而无需你的做任何额外的事情, 因此你将得到开箱即用的全面照顾.
准备好使用Raygun了吗?

如之前所提及的,有一个 30天免费的无信用卡支付的版本可用, 因此你可以获取一个来看看你的应用是否真的是在为你的用户运作的. 如果就本文你有任何的疑问,请将它们留在下面的评论中。

回复

使用道具 举报

2

主题

2万

回帖

146

积分

注册会员

Rank: 2

积分
146
发表于 2023-1-11 02:16:04 | 显示全部楼层
为全额万千瓦
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

155

积分

注册会员

Rank: 2

积分
155
发表于 2023-1-13 13:14:55 | 显示全部楼层
需要很久了终于找到了
回复 支持 反对

使用道具 举报

1

主题

1386

回帖

1509

积分

金牌会员

Rank: 6Rank: 6

积分
1509
发表于 2023-2-5 23:51:09 | 显示全部楼层
强烈支持楼主ing……
回复 支持 反对

使用道具 举报

9

主题

2万

回帖

420

积分

中级会员

Rank: 3Rank: 3

积分
420
发表于 2023-4-27 09:41:33 | 显示全部楼层
啦啦啦啦啦德玛西亚
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2024-3-1 13:25:31 | 显示全部楼层
啦啦啦啦啦啦哈哈哈
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

115

积分

注册会员

Rank: 2

积分
115
发表于 2024-3-19 18:11:35 | 显示全部楼层
啦啦啦啦啦德玛西亚
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

321

积分

中级会员

Rank: 3Rank: 3

积分
321
发表于 2024-5-20 18:04:08 | 显示全部楼层
为全额万千瓦
回复 支持 反对

使用道具 举报

3

主题

2万

回帖

172

积分

注册会员

Rank: 2

积分
172
发表于 2024-6-10 13:07:12 | 显示全部楼层
天天源码论坛
回复 支持 反对

使用道具 举报

3

主题

2万

回帖

163

积分

注册会员

Rank: 2

积分
163
发表于 2024-7-23 23:17:18 | 显示全部楼层
我找了挺久终于找到了
TS人妖演出表演服务q3268336102电话13168842816
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies

本版积分规则

手机版|小黑屋|网站地图|源码论坛 ( 海外版 )

GMT+8, 2025-2-2 08:40 , Processed in 0.066458 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表